@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600&family=Newsreader:ital,opsz,wght@0,6..72,400;1,6..72,400&display=swap');

:root{--sea:#315f7b;--sea-dark:#23475d;--sky:#dcecf2;--mist:#eef5f6;--paper:#fbfaf6;--sand:#e9e0d1;--ink:#20313a;--muted:#68777d;--line:#d6e0e2}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:'DM Sans',Arial,sans-serif}.site-header{height:88px;padding:0 clamp(24px,6vw,90px);display:flex;align-items:center;justify-content:space-between;background:var(--paper);border-bottom:1px solid var(--line)}.brand{color:var(--sea-dark);text-decoration:none;display:flex;flex-direction:column}.brand span{font:30px/1 'Newsreader',serif}.brand small{font-size:8px;text-transform:uppercase;letter-spacing:.18em;margin-top:5px}.site-header nav{display:flex;align-items:center;gap:34px}.site-header nav a{color:var(--ink);text-decoration:none;font-size:12px}.nav-button{border:1px solid var(--sea);border-radius:99px;padding:11px 18px;color:var(--sea)!important}.hero{position:relative;background:var(--sky);padding:0 clamp(16px,3vw,42px) 46px}.hero-image{height:min(71vh,720px);min-height:500px;background:url('public/tossa-panorama.jpg') center 52%/cover no-repeat;border-radius:0 0 3px 3px}.hero-panel{position:absolute;left:clamp(36px,8vw,130px);bottom:0;background:rgba(251,250,246,.96);padding:clamp(34px,5vw,68px);width:min(600px,calc(100% - 72px));box-shadow:0 20px 50px #23475d18}.kicker,.section-label{font-size:10px;text-transform:uppercase;letter-spacing:.18em;font-weight:600;color:var(--sea)}.hero h1,.intro h2,.section-heading h2,.visit h2{font:clamp(50px,5.8vw,86px)/.92 'Newsreader',serif;letter-spacing:-.035em;margin:25px 0}.hero h1 em{color:var(--sea);font-weight:400}.hero-panel>p:not(.kicker){max-width:490px;color:var(--muted);font-size:16px;line-height:1.65}.hero-links{display:flex;gap:26px;align-items:center;margin-top:30px}.hero-links a{color:var(--sea-dark);font-size:12px;font-weight:600;text-underline-offset:5px}.hero-links .primary{background:var(--sea);color:#fff;text-decoration:none;border-radius:99px;padding:14px 22px}.intro{padding:150px clamp(24px,8vw,120px) 130px;display:grid;grid-template-columns:.35fr 1.2fr .8fr;gap:5vw;align-items:start}.intro h2{font-size:clamp(50px,5.3vw,78px);color:var(--sea-dark);margin:0}.intro-copy{padding-top:12px}.intro-copy p{line-height:1.75;color:var(--muted);margin:0 0 22px}.intro-copy p:first-child{font:22px/1.55 'Newsreader',serif;color:var(--ink)}.specialties{background:var(--mist);padding:120px clamp(24px,7vw,110px)}.section-heading{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:75px}.section-heading h2{margin:0;color:var(--sea-dark);font-size:clamp(48px,5vw,72px);text-align:right}.specialty-grid{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid #bfd0d5}.specialty-grid article{padding:42px 8% 35px;border-right:1px solid #bfd0d5;min-height:340px}.specialty-grid article:last-child{border-right:0}.specialty-grid span{font-size:10px;color:var(--sea);letter-spacing:.15em}.specialty-grid h3{font:38px/1.05 'Newsreader',serif;color:var(--sea-dark);margin:55px 0 25px}.specialty-grid p{color:var(--muted);line-height:1.7;font-size:14px}.visit{padding:120px clamp(24px,7vw,110px);display:grid;grid-template-columns:.8fr 1.2fr;gap:8vw;align-items:center}.visit h2{font-size:clamp(50px,5vw,76px);color:var(--sea-dark)}.visit address{font:25px/1.4 'Newsreader',serif;font-style:normal;margin:40px 0 25px}.contact{display:flex;flex-direction:column;gap:8px}.contact a,.directions{color:var(--sea);font-size:13px;text-underline-offset:5px}.directions{display:inline-flex;gap:18px;margin-top:32px;font-weight:600}.map-wrap{height:550px;background:var(--sky);padding:12px}.map-wrap iframe{width:100%;height:100%;border:0;filter:saturate(.65) contrast(.95)}footer{background:var(--sea-dark);color:#dcecf2;padding:80px clamp(24px,7vw,110px) 60px;display:grid;grid-template-columns:1fr 1fr auto;align-items:end;gap:40px}.footer-brand{color:#fff}.footer-brand span{font-size:42px}footer p{font:22px/1.45 'Newsreader',serif;margin:0}footer>small{font-size:9px;letter-spacing:.12em}.photo-credit{background:var(--sea-dark);color:#91aab8;font-size:8px;padding:0 clamp(24px,7vw,110px) 20px;letter-spacing:.04em}
@media(max-width:850px){.site-header nav a:not(.nav-button){display:none}.hero{padding:0 16px 38px}.hero-image{height:58vh;min-height:420px}.hero-panel{position:relative;left:auto;bottom:auto;width:calc(100% - 28px);margin:-85px auto 0;padding:40px}.intro{grid-template-columns:1fr;padding:100px 7vw}.intro>.section-label{margin-bottom:-20px}.specialties{padding:90px 7vw}.section-heading{align-items:flex-start;flex-direction:column;gap:25px}.section-heading h2{text-align:left}.specialty-grid{grid-template-columns:1fr}.specialty-grid article{border-right:0;border-bottom:1px solid #bfd0d5;min-height:260px;padding-left:0}.specialty-grid h3{margin-top:30px}.visit{grid-template-columns:1fr;padding:90px 7vw}.map-wrap{height:440px}footer{grid-template-columns:1fr}}
@media(max-width:520px){.site-header{height:76px;padding:0 20px}.brand span{font-size:26px}.hero-image{min-height:340px;background-position:58% center}.hero-panel{padding:32px 25px;width:calc(100% - 20px);margin-top:-55px}.hero h1{font-size:47px}.hero-links{align-items:flex-start;flex-direction:column}.intro{padding:80px 24px}.intro h2,.section-heading h2,.visit h2{font-size:47px}.specialties,.visit{padding:75px 24px}.map-wrap{height:360px;padding:7px}footer{padding:65px 24px 45px}.photo-credit{padding:0 24px 18px}}
/* Calm full-width hero: keep the Tossa panorama unobstructed. */
.hero{display:flex;flex-direction:column;background:var(--paper);padding:0}
.hero-image{height:min(68vh,700px);min-height:500px;margin:0 clamp(16px,3vw,42px);background-position:center 52%;border-radius:0}
.hero-panel{position:static;order:-1;width:auto;max-width:940px;margin:0;padding:90px clamp(30px,8vw,130px) 65px;background:var(--paper);box-shadow:none}
@media(max-width:850px){.hero{padding:0}.hero-image{height:58vh;min-height:420px;margin:0 16px}.hero-panel{width:auto;margin:0;padding:70px 7vw 50px}}
@media(max-width:520px){.hero-image{min-height:340px;margin:0;background-position:58% center}.hero-panel{width:auto;margin:0;padding:55px 24px 40px}}

/* Readability and wider introduction. */
body{font-size:17px}
.brand small{font-size:10px}.site-header nav a{font-size:14px}
.hero-panel{max-width:1180px;width:100%;padding-right:clamp(30px,8vw,130px)}
.hero h1{font-size:clamp(58px,6.6vw,98px)}
.hero-panel>p:not(.kicker){max-width:700px;font-size:18px}
.kicker,.section-label{font-size:12px}
.hero-links a{font-size:14px}
.intro-copy p{font-size:17px}.intro-copy p:first-child{font-size:25px}
.specialty-grid span{font-size:12px}.specialty-grid p{font-size:16px}
.contact a,.directions{font-size:15px}
footer>small{font-size:11px}.photo-credit{font-size:10px}
@media(max-width:520px){body{font-size:16px}.hero-panel{width:100%;padding:55px 24px 40px}.hero h1{font-size:51px}.hero-panel>p:not(.kicker){font-size:17px}.kicker,.section-label{font-size:11px}}

.header-actions{display:flex;align-items:center;gap:28px}.languages{display:flex!important;gap:10px!important;padding-left:24px;border-left:1px solid var(--line)}.languages a{font-size:11px!important;letter-spacing:.08em;color:var(--muted)!important}.languages a.active{color:var(--sea-dark)!important;font-weight:600;text-decoration:underline;text-underline-offset:4px}
@media(max-width:850px){.header-actions{gap:14px}.languages{padding-left:12px}.languages a{display:inline!important}.site-header nav:first-child a:not(.nav-button){display:none}}
@media(max-width:520px){.site-header nav:first-child{display:none}.languages{border-left:0;padding-left:0;gap:9px!important}.languages a{font-size:10px!important}}

/* Blend the panorama into the hero instead of presenting it as a hard block. */
.hero-panel{padding-bottom:88px}
.hero-image{margin-top:-46px;border-radius:18px;box-shadow:0 24px 55px rgba(35,71,93,.12);-webkit-mask-image:linear-gradient(to bottom,transparent 0%,rgba(0,0,0,.28) 7%,#000 22%,#000 100%);mask-image:linear-gradient(to bottom,transparent 0%,rgba(0,0,0,.28) 7%,#000 22%,#000 100%)}
@media(max-width:850px){.hero-panel{padding-bottom:72px}.hero-image{margin-top:-36px;border-radius:14px;-webkit-mask-image:linear-gradient(to bottom,transparent 0%,#000 18%,#000 100%);mask-image:linear-gradient(to bottom,transparent 0%,#000 18%,#000 100%)}}
@media(max-width:520px){.hero-panel{padding-bottom:58px}.hero-image{margin-top:-28px;border-radius:0;box-shadow:none}}

/* Full-bleed cinematic panorama. */
.hero{overflow:hidden}.hero-panel{padding-bottom:110px}.hero-image{position:relative;width:100%;height:min(78vh,820px);min-height:620px;margin:-62px 0 0;border-radius:0;box-shadow:none;background-image:linear-gradient(180deg,rgba(251,250,246,.48) 0%,transparent 24%,transparent 62%,rgba(20,49,65,.58) 100%),url('public/tossa-panorama.jpg');background-position:center 55%;background-size:cover;-webkit-mask-image:linear-gradient(to bottom,transparent 0%,#000 15%,#000 100%);mask-image:linear-gradient(to bottom,transparent 0%,#000 15%,#000 100%)}
.hero-caption{position:absolute;left:clamp(24px,7vw,110px);right:clamp(24px,7vw,110px);bottom:42px;color:#fff;display:grid;grid-template-columns:1fr auto;align-items:end;text-shadow:0 2px 18px rgba(13,41,57,.42)}.hero-caption span{grid-column:1/-1;font-size:11px;letter-spacing:.18em;text-transform:uppercase;margin-bottom:10px}.hero-caption strong{font:clamp(48px,6vw,88px)/.85 'Newsreader',serif;font-weight:400;letter-spacing:-.04em}.hero-caption small{font-size:12px;letter-spacing:.16em;text-transform:uppercase;padding-bottom:5px}
@media(max-width:850px){.hero-panel{padding-bottom:88px}.hero-image{height:68vh;min-height:520px;margin:-48px 0 0;border-radius:0}.hero-caption{bottom:28px}.hero-caption strong{font-size:58px}}
@media(max-width:520px){.hero-panel{padding-bottom:72px}.hero-image{height:64vh;min-height:470px;margin-top:-38px;background-position:58% center}.hero-caption{left:22px;right:22px;bottom:24px;grid-template-columns:1fr}.hero-caption strong{font-size:48px}.hero-caption small{margin-top:8px;font-size:10px}}

/* Bring the coastline into the first view. */
.hero-panel{padding-top:62px;padding-bottom:62px}.hero-image{margin-top:-34px;background-position:center 68%;-webkit-mask-image:linear-gradient(to bottom,transparent 0%,#000 8%,#000 100%);mask-image:linear-gradient(to bottom,transparent 0%,#000 8%,#000 100%)}
@media(max-width:850px){.hero-panel{padding-top:54px;padding-bottom:54px}.hero-image{margin-top:-26px;background-position:center 66%;-webkit-mask-image:linear-gradient(to bottom,transparent 0%,#000 7%,#000 100%);mask-image:linear-gradient(to bottom,transparent 0%,#000 7%,#000 100%)}}
@media(max-width:520px){.hero-panel{padding-top:44px;padding-bottom:44px}.hero-image{margin-top:-18px;background-position:58% 66%}}

/* Editorial overlay: full image, soft text blend, no hard panel. */
@media(min-width:851px){.hero{position:relative;display:block;min-height:760px;background:var(--paper)}.hero-image{height:calc(100vh - 88px);min-height:720px;margin:0;background-position:center 58%;-webkit-mask-image:none;mask-image:none}.hero-image:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(251,250,246,.97) 0%,rgba(251,250,246,.91) 37%,rgba(251,250,246,.38) 61%,transparent 78%)}.hero-panel{position:absolute;z-index:2;left:0;top:0;width:64%;max-width:900px;padding:clamp(70px,9vh,110px) 0 70px clamp(50px,8vw,130px);background:transparent}.hero h1{font-size:clamp(66px,7vw,104px)}.hero-caption{z-index:2}.hero-caption strong{font-size:clamp(56px,6vw,90px)}}