/* V3: one integrated landscape, with crisp, independently tappable signs. */
.island-header{position:relative;z-index:20;max-width:1280px;min-height:76px;margin:auto;padding:12px 28px;display:flex;align-items:center;justify-content:space-between;gap:12px;background:#fff}
.island-brand{text-decoration:none!important;color:#233c36;font-size:16px;font-weight:800;line-height:1.5}
.island-brand>span{display:block;font-size:11px;font-weight:500;color:#65716b;margin-top:2px}
.island-brand .island-brand-name{font-size:16px;font-weight:800;color:#233c36;margin:0}.island-brand-name strong{font-weight:800}
.island-textnav{position:relative;flex:none;font-size:14px;color:#284e3f}
.island-textnav summary{list-style:none;cursor:pointer;min-height:44px;padding:12px 16px;background:#f1f4ea;border:1px solid #d9e1d2;border-radius:28px;font-weight:700}
.island-textnav summary::-webkit-details-marker{display:none}
.island-textnav nav{position:absolute;right:0;top:54px;display:grid;min-width:224px;padding:10px;background:#fffef8;border:1px solid #d9e1d2;border-radius:14px;box-shadow:0 10px 24px #23433020}
.island-textnav nav a{color:#264d3d;min-height:48px;padding:12px;border-radius:8px;text-decoration:none;font-size:16px}
.island-textnav nav a:hover{background:#eef1e3}
.island a:focus-visible,.island-header a:focus-visible,.island-header summary:focus-visible{outline:3px solid #125b46;outline-offset:3px}
.island{--sea:#cce7df;--ink:#294d3c;background:var(--sea);color:var(--ink);padding:18px 0 0;overflow:hidden}
.island-intro{text-align:center;padding:0 14px;margin:0 auto 8px;position:relative;z-index:1}
.island-eyebrow{font-size:14px!important;line-height:1.5!important;letter-spacing:.08em;margin:0 0 7px!important;font-weight:700;color:#57765e}
.island #island-title{font-size:28px;line-height:1.45;letter-spacing:.015em;color:var(--ink);margin:0;font-weight:800}
.island-mobile-break{display:none}
.island-lead{font-size:16px!important;line-height:1.6!important;margin:8px 0 0!important;color:#486853}
.island-map{position:relative;width:min(100%,850px);aspect-ratio:1;margin:0 auto;isolation:isolate}
.island-art{display:block;width:100%;height:100%;object-fit:contain;mask-image:linear-gradient(to bottom,transparent,#000 2% 98%,transparent);-webkit-mask-image:linear-gradient(to bottom,transparent,#000 2% 98%,transparent)}
.island-stops{list-style:none!important;margin:0!important;padding:0!important;position:absolute;inset:0}
.island-stop{position:absolute;left:var(--x);top:var(--y);transform:translate(-50%,-50%);margin:0!important;padding:0!important}
.island-sign{position:relative;display:flex;align-items:center;justify-content:center;flex-direction:column;min-height:48px;padding:9px 15px;background:#fffbee;color:#234b3a!important;border:1px solid #bca582;border-radius:6px;box-shadow:0 3px 0 #a38b65,0 5px 8px #16342326;text-decoration:none!important;white-space:nowrap;transition:filter .15s}
.island-sign:after{content:"";position:absolute;width:4px;height:7px;background:#a38b65;left:50%;bottom:-10px;border-radius:0 0 1px 1px;pointer-events:none}
.island-name{font-size:17px;font-weight:800;line-height:1.3;letter-spacing:0}
.island-kind{font-size:14px;line-height:1.25;font-weight:600}
.island-stop--consultation .island-sign{background:#245c43;color:#fff!important;border-color:#245c43;box-shadow:0 3px 0 #163e2d,0 6px 10px #16342330;padding:6px 19px}
.island-stop--consultation .island-name{font-size:19px}.island-stop--consultation .island-sign:after{background:#163e2d}
.island-sign:hover{filter:brightness(1.05)}.island-sign:hover .island-name{text-decoration:underline;text-underline-offset:3px}
.island-bridge{text-align:center;background:linear-gradient(transparent,#fff);padding:8px 12px 20px}
.island-bridge>span{font-size:22px;display:block;line-height:1.3;color:#577b56}
.island-bridge p{font-size:14px!important;line-height:1.6!important;margin:6px 0 0!important;color:#36593f}
.island-return{max-width:1120px;margin:auto;padding:10px 20px 0}
.island-return a{display:inline-flex;min-height:44px;align-items:center;color:#2d624c;font-size:14px;text-decoration:none}
@media(min-width:1100px) and (min-height:800px){.island-map{width:min(100%,calc(100svh - 250px),850px)}}
@media(max-width:1099px){.island-header{min-height:70px;padding:10px 20px}.island-map{max-width:680px}.island-mobile-break{display:block}.island #island-title{font-size:24px}.island-sign{min-height:44px;padding:8px 12px}.island-name{font-size:16px}.island-stop--consultation .island-name{font-size:18px}}
@media(max-width:480px){
.island-header{padding:9px 14px;gap:8px;min-height:78px}
.island-brand .island-brand-name{font-size:12px;line-height:1.45}.island-brand-name strong{display:block;font-size:18px;letter-spacing:.06em}.island-brand>span:not(.island-brand-name){font-size:11px;margin-top:1px}
.island-textnav summary{font-size:12px;padding:12px 10px}
.island{padding-top:15px}.island-intro{margin-bottom:2px}.island #island-title{font-size:22px;line-height:1.45}.island-eyebrow{margin-bottom:5px!important}.island-lead{margin-top:6px!important}
.island-map{width:100%;max-width:440px}
.island-sign{min-height:44px;padding:7px 8px;border-radius:5px}
.island-name{font-size:14px}.island-kind{font-size:14px}
.island-stop--consultation .island-sign{padding:5px 13px}.island-stop--consultation .island-name{font-size:16px}
.island-bridge{padding-top:7px;padding-bottom:14px}
}
@media(max-width:350px){.island-header{padding-inline:10px}.island #island-title{font-size:20px}.island-intro{padding-inline:8px}.island-sign{padding-inline:5px}.island-stop--consultation .island-sign{padding-inline:11px}}
@media(prefers-reduced-motion:reduce){.island-sign{transition:none}}
/* On phones the sign face is compact, while its transparent touch area stays >=44px. */
@media(max-width:480px){
.island-stop:not(.island-stop--consultation) .island-sign{padding:14px 0 0;min-height:44px;justify-content:flex-end;background:transparent;border:0;box-shadow:none}
.island-stop:not(.island-stop--consultation) .island-name{display:block;padding:4px 8px;background:#fffbee;border:1px solid #bca582;border-radius:4px;box-shadow:0 2px 0 #a38b65,0 3px 5px #16342325}
.island-stop:not(.island-stop--consultation) .island-sign:after{bottom:-6px;height:4px}
.island-stop--services,.island-stop--about{top:28%}
.island-stop--faq{top:54%}
.island-stop--pricing{top:56%}
.island-stop--consultation{top:56.5%}
.island-stop--photo,.island-stop--cases{top:82.5%}
}
@media(max-width:350px){.island-stop:not(.island-stop--consultation) .island-name{padding-inline:5px}}

/* V4: mobile only. Dedicated ground aprons, clear pointers, protected objects. */
.island-map>picture{display:contents}.island-connectors{display:none}
@media(max-width:480px){
 .island-connectors{display:block;position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible}
 .island-connectors path{fill:none;stroke:#265c44;stroke-width:2;vector-effect:non-scaling-stroke}
 .island-connectors circle{fill:#265c44;stroke:#fffbee;stroke-width:1.5;vector-effect:non-scaling-stroke}
 .island-stop .island-sign,.island-stop:not(.island-stop--consultation) .island-sign{min-height:44px;padding:0 7px;justify-content:center;background:transparent;border:0;box-shadow:none;border-radius:5px}
 .island-stop .island-sign:before{content:"";position:absolute;inset:8px 0;background:#fffbee;border:1px solid #bca582;border-radius:5px;box-shadow:0 2px 3px #16342325;z-index:-1}
 .island-stop .island-sign:after{display:none}
 .island-stop:not(.island-stop--consultation) .island-name{padding:0;background:transparent;border:0;border-radius:0;box-shadow:none;font-size:14px}
 .island-stop--consultation .island-sign{min-height:50px;padding:4px 10px}
 .island-stop--consultation .island-sign:before{inset:0;background:#245c43;border-color:#245c43}
 .island-stop--consultation .island-name{font-size:16px}
 .island-stop--services{left:25%;top:31%}.island-stop--about{left:75%;top:31%}
 .island-stop--faq{left:16%;top:59%}.island-stop--consultation{left:50%;top:59%}.island-stop--pricing{left:84%;top:59%}
 .island-stop--photo{left:25%;top:89%}.island-stop--cases{left:75%;top:89%}
}
@media(max-width:350px){.island-stop .island-sign,.island-stop:not(.island-stop--consultation) .island-sign{padding-inline:4px}.island-stop--consultation .island-sign{padding-inline:8px}}

@media(max-width:480px){
 .island-stop--services,.island-stop--about{top:28.5%}
 .island-stop--faq,.island-stop--consultation,.island-stop--pricing{top:54%}
 .island-stop--photo,.island-stop--cases{top:84%}
 .island-stop--consultation .island-sign{flex-direction:row;gap:1px;min-height:44px;padding:0 7px}
 .island-stop--consultation .island-sign:before{inset:8px 0}
 .island-stop--consultation .island-kind,.island-stop--consultation .island-name{font-size:14px;font-weight:800;line-height:1.3}
}
@media(max-width:350px){.island-stop--consultation .island-sign{padding-inline:4px}}

/* Adopted welcoming copy: local subset fonts, scoped to island introduction. */
@font-face{font-family:"Island Welcome";src:url("/island-assets/fonts/welcome-maru-bold.ttf") format("truetype");font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:"Island Maru";src:url("/island-assets/fonts/heading.ttf") format("truetype");font-weight:500;font-style:normal;font-display:swap}
.island .island-eyebrow{font-family:"Island Welcome","Hiragino Maru Gothic ProN",sans-serif;font-weight:700;font-size:18px!important;letter-spacing:.025em;color:#42644e;line-height:1.5!important}
.island #island-title{font-family:"Island Maru","Hiragino Maru Gothic ProN",sans-serif;font-weight:500;letter-spacing:.015em}

/* Brand typography trial: preserve navigation and service-area typography. */
@font-face{font-family:"Island Brand";src:url("/island-assets/fonts/brand-descriptor.ttf") format("truetype");font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:"Island Brand";src:url("/island-assets/fonts/brand-name.ttf") format("truetype");font-weight:700;font-style:normal;font-display:swap}
.island-header{padding-block:9px}
.island-brand .island-brand-name{font-family:"Island Brand","Hiragino Maru Gothic ProN",sans-serif;font-size:12px;font-weight:500;line-height:1.4;color:#294d3c;white-space:nowrap}
.island-brand .island-brand-name strong{display:block;font-family:"Island Brand","Hiragino Maru Gothic ProN",sans-serif;font-size:22px;font-weight:700;line-height:1.1;letter-spacing:.09em;color:#294d3c}

/* Isolate header menu from FAQ details/nav styles on destination pages. */
.island-header .island-textnav{margin:0;padding:0;border:0;border-radius:0;background:transparent;line-height:1.5;overflow:visible}
.island-header .island-textnav summary{display:block}
.island-header .island-textnav summary:after{content:none!important}
.island-header .island-textnav nav{grid-template-columns:minmax(0,1fr);width:224px;gap:0;justify-content:stretch}
/* Reading completion: keep both consultation and island navigation reachable. */
.island-next{display:grid;grid-template-columns:minmax(0,1fr);gap:10px;width:auto;max-width:540px;margin:8px auto 32px;padding:0 18px;justify-content:stretch}
.island-next a{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:48px;padding:12px 16px;border:1px solid #b8cebf;border-radius:8px;background:#f3f7f2;color:#294d3c;font-size:15px;font-weight:700;line-height:1.5;text-decoration:none}
.island-next a:hover{background:#e7f0e6}
.island-next a:focus-visible{outline:3px solid #125b46;outline-offset:3px}

/* Case comparison captions remain crisp HTML, independent of the illustration. */
.case-comparison{position:absolute;inset:0;pointer-events:none;z-index:2;display:none}
.case-comparison span{position:absolute;transform:translate(-50%,-50%);white-space:nowrap;line-height:1.4;font-family:sans-serif;font-weight:700;font-size:12px}
.case-before,.case-after{padding:2px 3px;border-radius:4px;background:#fffbee;color:#654a2e;border:1px solid #b9a286;box-shadow:0 1px 2px #23433020}
.case-after{background:#f0f8ee;color:#245c43;border-color:#759d79}
.case-arrow{color:#245c43;font-size:16px!important}
@media(max-width:480px){
.case-comparison{display:block}
.case-before{left:65%;top:80%}.case-after{left:85.5%;top:80%}.case-arrow{left:75.25%;top:80%}
.island-stop--cases{top:91%}
.island-connectors g[data-for="cases"] path{d:path("M75 84 V88")}
.island-connectors g[data-for="cases"] circle{cy:84}
}

@media(max-width:350px){.case-before,.case-after{padding-inline:1px}.case-arrow{font-size:14px!important}}

@media(max-width:350px){.case-before{left:64.5%}.case-after{left:86%}}