/* Original art direction for the six September service pages.
   Shared navigation and entrance timing remain in their own stylesheets. */
.art-page{--art-accent:#536247;--art-wash:#f1eee5}
.art-page--media{--art-accent:#9b612c;--art-wash:#f4ebdc}
.art-page--fareharbor,.art-page--booking-bvi{--art-accent:#225c58;--art-wash:#e9efeb}
.art-page--st-croix{--art-accent:#995640;--art-wash:#f4e9df}
.art-page--bvi{--art-accent:#256965;--art-wash:#e9efeb}
.art-hero{position:relative;isolation:isolate;overflow:hidden}
.art-composition{position:relative;display:grid;container-type:inline-size}
.art-heading{grid-area:heading;align-self:end;position:relative;z-index:2}
.art-heading h1{font:400 clamp(64px,9cqi,132px)/.92 var(--label);letter-spacing:-.055em;color:#25362d}
.art-heading h1>span,.art-heading h1>em{display:block}
.art-heading h1>em{font-weight:400;color:var(--art-accent)}
.art-heading h1>small{display:block;font:italic 400 27px/1.25 var(--label);letter-spacing:-.015em;margin-bottom:20px;color:var(--art-accent)}
.art-heading h1>small.art-heading-tail{margin:24px 0 0;font:500 13px/1.5 var(--data);letter-spacing:.16em;text-transform:uppercase}
.art-heading .svc-deck{margin-bottom:32px;font-size:9px;letter-spacing:.18em}
.art-figure{grid-area:art;position:relative;min-width:0;align-self:center}
.art-figure img{width:100%;height:100%;object-fit:cover}
.art-hero .svc-hero-copy{grid-area:copy;align-self:start;position:relative;z-index:2;min-width:0}
.art-hero .svc-lede{font-size:clamp(23px,2.1vw,29px);line-height:1.35;max-width:26ch;color:#344338}
.art-hero .svc-hero-copy>p:not(.svc-lede){font-size:15px;max-width:40ch}
.art-hero .svc-actions{margin-top:30px}
.art-hero .asc-btn{font-size:9px;padding-inline:23px;letter-spacing:.14em}
.art-composition::after{content:"";position:absolute;height:1px;background:var(--rule);pointer-events:none}


/* Label hero: the photograph fills the frame and the copy sits on a museum label. */
.art-hero--booking-bvi{position:relative;min-height:clamp(700px,calc(100svh - 72px),880px);background:#082e2d}
.art-hero--booking-bvi .bvi-scene{position:absolute;inset:0;margin:0}
.art-hero--booking-bvi .bvi-scene img{width:100%;height:100%;object-fit:cover;object-position:62% center}
.art-hero--booking-bvi .bvi-scene::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,#082e2d99,transparent 18%),linear-gradient(90deg,#082e2d66,transparent 45%);pointer-events:none}
.art-hero--booking-bvi .bvi-register{position:relative;display:flex;justify-content:space-between;gap:20px;padding-top:28px;font:500 9px/1.5 var(--data);letter-spacing:.22em;text-transform:uppercase;color:#f3ecd6;text-shadow:0 1px 10px #041615b3}
.art-hero--booking-bvi .bvi-card{position:absolute;left:calc((100% - min(1320px,calc(100% - 112px)))/2);bottom:64px;width:min(470px,calc(100% - 48px));padding:40px 40px 36px;background:#f6f2e7;box-shadow:0 30px 60px #04161559}
.art-hero--booking-bvi .bvi-card::before{content:"";position:absolute;inset:7px;border:1px solid #c8b893;pointer-events:none}
.art-hero--booking-bvi .bvi-card h1{font:400 clamp(52px,5.2vw,74px)/.95 var(--label);letter-spacing:-.05em;color:#173a36}
.art-hero--booking-bvi .bvi-card h1 em{display:block;font-weight:400;color:#2d6b64}
.art-hero--booking-bvi .bvi-card .svc-lede{margin-top:22px;font-size:21px;line-height:1.4;color:#1f3b35}
.art-hero--booking-bvi .bvi-card>p:not(.svc-lede){margin-top:14px;font-size:14px;line-height:1.75;color:var(--text)}
.art-hero--booking-bvi .bvi-card .svc-actions{margin-top:26px}

/* The light study: typography balanced against a tall glass still life. */
.art-hero--media{background:#faf8f3}
.art-hero--media .art-composition{grid-template-columns:1fr 1fr;grid-template-rows:auto auto;grid-template-areas:"heading art" "copy art";gap:40px 6%;padding-block:54px;min-height:740px}
.art-hero--media .art-heading{padding-top:25px}
.art-hero--media .art-figure{height:660px;max-width:440px;justify-self:end;width:100%;box-shadow:14px 14px 0 #e8dfce;outline:1px solid #ad9676;outline-offset:7px}
.art-hero--media .art-composition::after{bottom:75px;left:0;width:34%}

/* A botanical portrait in a soft stone arch. */
.art-hero--care{background:#f2ebdd}
.art-hero--care .art-composition{grid-template-columns:1.05fr 1fr;grid-template-rows:1fr 1fr;grid-template-areas:"heading art" "copy art";gap:34px 7%;padding-block:62px;min-height:780px}
.art-hero--care .art-heading h1{font-size:clamp(62px,10.8cqi,142px)}
.art-hero--care .art-figure{width:min(100%,435px);height:652px;justify-self:center;border-radius:46% 46% 0 0;overflow:hidden;outline:1px solid #b5a78c;outline-offset:9px}
.art-hero--care .art-composition::after{bottom:62px;left:0;width:33%}

/* Bronze wing: a dark museum diptych with the metalwork kept unobscured. */
.art-hero--fareharbor{background:#071411;color:#f5efdc}
.art-hero--fareharbor .art-composition{grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;grid-template-areas:"art heading" "art copy";gap:35px 6%;padding-block:44px;min-height:780px}
.art-hero--fareharbor .art-figure{height:700px;width:100%;max-width:467px;justify-self:start}
.art-hero--fareharbor .art-figure::after{content:"";position:absolute;inset:10px;border:1px solid #b99c6244;pointer-events:none}
.art-hero--fareharbor .art-heading h1{font-size:clamp(50px,6.9cqi,96px);color:#efe7d2;letter-spacing:-.05em}
.art-hero--fareharbor .art-heading h1>small{color:#c5af7c;font-size:clamp(25px,3cqi,38px)}
.art-hero--fareharbor .art-heading h1>small.art-heading-tail{color:#aab4a5;font-size:clamp(11px,1.05cqi,14px)}
.art-hero--fareharbor .svc-lede{color:#f1ecd9}
.art-hero--fareharbor .svc-hero-copy>p:not(.svc-lede){color:#c7cdbd}
.art-hero--fareharbor .asc-btn--line{color:#f3e8ce;border-color:#a59c79;background:transparent}
.art-hero--fareharbor .asc-btn--line::before{background:#f3e8ce}
.art-hero--fareharbor .asc-btn--line:hover{color:#071411}
.art-hero--fareharbor .art-composition::after{bottom:98px;right:0;width:42%;background:#b99c6255}


/* St. Croix: an architectural subject opening off the editorial column. */
.art-hero--st-croix{background:#f3e9d7}
.art-hero--st-croix .art-composition{grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;grid-template-areas:"heading art" "copy art";min-height:780px;gap:36px 0;padding-block:115px;isolation:isolate}
.art-hero--st-croix .art-heading h1{font-size:clamp(60px,9.1cqi,125px)}
.art-hero--st-croix .art-heading .svc-deck{max-width:280px;margin-bottom:34px;line-height:1.8;color:#795e43}
.art-hero--st-croix .art-figure{grid-area:auto;position:absolute;z-index:-1;right:calc(var(--bleed) * -1);top:0;bottom:0;width:88%;height:100%;mask-image:linear-gradient(to right,transparent 0,#000 28%);-webkit-mask-image:linear-gradient(to right,transparent 0,#000 28%)}
.art-hero--st-croix .art-figure img{object-position:69% center}
.art-hero--st-croix .svc-hero-copy{max-width:390px}
.art-hero--st-croix .art-composition::after{bottom:62px;left:0;width:31%;background:#bda78d}

/* BVI: a stone-and-water opening beside a quiet editorial column. */
.art-hero--bvi{background:#f4f1e8}
.art-hero--bvi .art-composition{position:static;grid-template-columns:minmax(0,58fr) minmax(0,42fr);grid-template-rows:1fr 1fr;grid-template-areas:". heading" ". copy";gap:34px 0;padding-block:80px;min-height:clamp(650px,calc(100svh - 72px),850px);isolation:isolate}
.art-hero--bvi .art-heading{padding-left:42px;align-self:end}
.art-hero--bvi .art-heading h1{font:400 clamp(64px,7cqi,96px)/1 var(--label);letter-spacing:-.05em;color:#234b44}
.art-hero--bvi .art-heading h1>em{color:#65816b}
.art-hero--bvi .svc-hero-copy{align-self:start;padding-left:42px}
.art-hero--bvi .svc-lede{max-width:24ch;font-size:clamp(22px,2cqi,27px);line-height:1.45}
.art-hero--bvi .svc-actions{padding-top:24px;margin-top:26px;border-top:1px solid #afa99380}
.art-hero--bvi .art-figure{grid-area:auto;position:absolute;z-index:-1;inset:0 auto 0 0;width:62%;height:100%;padding:0;border:0;mask-image:linear-gradient(to right,#000 77%,transparent 100%);-webkit-mask-image:linear-gradient(to right,#000 77%,transparent 100%)}
.art-hero--bvi .art-figure img{width:100%;height:100%;object-fit:cover;object-position:51% center}
.art-hero--bvi .art-composition::after{display:none}

/* The service ledger: open rules, generous type, quiet page-specific colour. */
.art-page .svc-section{padding-block:86px}
.art-page .svc-section--tint{background:var(--art-wash)}
.art-page main h2{font:400 clamp(42px,4.3vw,64px)/1.05 var(--label);text-transform:none;letter-spacing:-.04em;color:#293a31}
.art-page .svc-head{grid-template-columns:1fr 1fr;gap:48px;align-items:start;margin-bottom:44px}
.art-page .svc-head>p{margin-top:5px;font-size:16px;max-width:37ch}
.art-page .svc-plate{padding:0;background:transparent;border:0;box-shadow:none}
.art-page .svc-plate::before{display:none}
.art-page .svc-table thead th{padding:16px 0;border-top:1px solid #8a877466;border-bottom:1px solid #8a877466}
.art-page .svc-table tbody th{font-size:27px;padding-top:29px;padding-bottom:29px}
.art-page .svc-table tbody th>span{font-size:15px;max-width:52ch;line-height:1.75}
.art-page .svc-table td{font:400 31px/1.1 var(--label);color:var(--art-accent);padding-top:30px}
.art-page .svc-table td small{font:500 8px/1.5 var(--data);margin-top:10px}
.art-page .svc-table tbody tr:last-child{border-bottom:1px solid #8a877466}
.art-page .svc-ledger>li{padding-block:29px}
.art-page .svc-ledger h3{font-size:28px}
.art-page .svc-steps{counter-reset:stages}
.art-page .svc-steps>li{counter-increment:stages;padding-top:29px}
.art-page .svc-steps>li::before{content:counter(stages,decimal-leading-zero);position:static;display:block;width:auto;height:auto;background:none;transform:none;font:400 42px/1 var(--display);color:var(--art-accent);margin-bottom:24px}
.art-page .svc-contact{background:#162b25}
.art-page .svc-contact h2{font:italic 400 clamp(68px,8vw,108px)/1 var(--label);color:#f3ecdb;letter-spacing:-.035em;padding:0;text-transform:none}
.art-page .svc-contact-inner>p{max-width:36ch;color:#d2d2bd}
.art-page .svc-footer{color:#b3b7a7}
.art-page .svc-footer a{color:#d2c9b0}

@media(min-width:901px) and (max-width:1100px){
  .art-hero--media .art-figure{height:585px;width:390px;max-width:100%}
  .art-hero--care .art-figure{height:585px}
  .art-hero--fareharbor .art-figure{height:610px}
  .art-hero--media .art-composition,.art-hero--care .art-composition,.art-hero--fareharbor .art-composition{min-height:700px}
}
@media(max-width:900px){
  .art-hero--media .art-composition,.art-hero--care .art-composition,.art-hero--fareharbor .art-composition{grid-template-columns:1fr 1fr;gap:28px 6%;padding-block:44px;min-height:650px}
  .art-hero--media .art-figure,.art-hero--care .art-figure,.art-hero--fareharbor .art-figure{height:auto;aspect-ratio:2/3;width:100%}
  .art-heading h1{font-size:clamp(54px,9cqi,90px)}
  .art-hero--care .art-heading h1{font-size:clamp(54px,10cqi,94px)}
  .art-hero--fareharbor .art-heading h1{font-size:clamp(39px,6.7cqi,66px)}
  .art-hero .svc-lede{font-size:23px}
  .art-composition::after{display:none}
  .art-hero--st-croix .art-composition{min-height:720px;padding-block:80px}
  .art-hero--bvi .art-composition{grid-template-columns:minmax(0,52fr) minmax(0,48fr);gap:28px 0;padding-block:54px}
  .art-hero--bvi .art-heading,.art-hero--bvi .svc-hero-copy{padding-left:24px}
  .art-hero--bvi .art-heading h1{font-size:clamp(48px,7.1cqi,65px)}
  .art-hero--bvi .art-figure{width:58%}
  .art-page .svc-head{gap:25px}
}
@media(max-width:760px){
  .art-composition.page-width{width:calc(100% - 40px)}
  .art-hero--media .art-composition,.art-hero--care .art-composition,.art-hero--fareharbor .art-composition,.art-hero--st-croix .art-composition{grid-template-columns:minmax(0,1fr);grid-template-rows:auto;grid-template-areas:"heading" "art" "copy";gap:32px;min-height:0;padding-block:42px 50px}
  .art-heading h1,.art-hero--care .art-heading h1,.art-hero--st-croix .art-heading h1{font-size:clamp(63px,16cqi,110px)}
  .art-heading{align-self:auto}
  .art-hero--media .art-heading{padding:0}
  .art-heading .svc-deck,.art-hero--st-croix .art-heading .svc-deck{margin-bottom:22px;font-size:8px;max-width:none}
  .art-hero--media .art-figure{width:calc(100% - 24px);max-width:440px;height:auto;justify-self:center;box-shadow:9px 9px 0 #e8dfce;outline-offset:5px}
  .art-hero--care .art-figure{width:calc(100% - 26px);max-width:435px;height:auto;margin-block:7px}
  .art-hero--fareharbor .art-figure{width:100%;max-width:430px;height:auto;justify-self:center}
  .art-hero--fareharbor .art-heading h1{font-size:clamp(46px,13cqi,88px);letter-spacing:-.055em}
  .art-hero--fareharbor .art-heading h1>small{font-size:26px;margin-bottom:16px}
  .art-hero .svc-lede{font-size:25px;max-width:29ch}
  .art-hero .svc-hero-copy>p:not(.svc-lede){max-width:44ch}
  .art-hero .svc-actions{gap:10px;margin-top:25px}
  .art-hero .asc-btn{font-size:8px;padding-inline:18px;min-height:47px}
  .art-hero--st-croix .art-figure{grid-area:art;position:relative;inset:auto;z-index:auto;width:calc(100% + 40px);height:auto;aspect-ratio:3/2;margin-inline:-20px;mask-image:none;-webkit-mask-image:none}
  .art-hero--st-croix .art-figure img{object-position:center}
  .art-hero--bvi .art-composition{position:relative;grid-template-columns:minmax(0,1fr);grid-template-rows:auto;grid-template-areas:"art" "heading" "copy";padding-block:0 48px;gap:24px;min-height:0}
  .art-hero--bvi .art-heading{padding:0;margin-top:-34px}
  .art-hero--bvi .art-heading h1{font-size:clamp(53px,14cqi,82px)}
  .art-hero--bvi .svc-hero-copy{padding:0}
  .art-hero--bvi .svc-lede{font-size:23px;max-width:29ch}
  .art-hero--bvi .svc-actions{padding:0;margin-top:24px;border:0}
  .art-hero--bvi .art-figure{grid-area:art;position:relative;inset:auto;z-index:0;width:calc(100% + 40px);height:auto;aspect-ratio:1.35;margin-inline:-20px;mask-image:linear-gradient(to bottom,#000 75%,transparent);-webkit-mask-image:linear-gradient(to bottom,#000 75%,transparent)}
  .art-page .svc-section{padding-block:58px}
  .art-page .svc-head{grid-template-columns:1fr;gap:20px;margin-bottom:32px}
  .art-page main h2{font-size:43px}
  .art-page .svc-table tbody th{font-size:23px;padding-block:23px}
  .art-page .svc-table tbody th>span{font-size:13.5px}
  .art-page .svc-table td{font-size:25px;padding-top:25px}
  .art-page--fareharbor .svc-table td{font-size:19px}
  .art-page .svc-contact h2{font-size:74px}
}
@media(max-width:900px){
  .art-hero--booking-bvi{min-height:0;padding-bottom:24px}
  .art-hero--booking-bvi .bvi-scene{position:relative;height:56vw}
  .art-hero--booking-bvi .bvi-register{position:absolute;inset:0 20px auto}
  .art-hero--booking-bvi .bvi-card{position:relative;left:auto;bottom:auto;width:auto;margin:-60px 20px 0}
}