@import "tailwindcss";

:root { --ink:#0c2f2f; --deep:#082c2e; --teal:#0f5b5d; --mint:#d7ece4; --foam:#f3f7f2; --sand:#e9bd68; --coral:#f06f50; --paper:#fffdf8; --line:rgba(12,47,47,.14); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:var(--font-sans),sans-serif; }
a { color:inherit; text-decoration:none; }
button,input,select,textarea { font:inherit; }
button { color:inherit; }
img,video { display:block; width:100%; }
em { font-family:var(--font-display),serif; font-weight:500; }
.site-header { height:94px; padding:0 clamp(24px,5vw,76px); display:flex; align-items:center; justify-content:space-between; position:relative; z-index:30; border-bottom:1px solid var(--line); background:rgba(255,253,248,.92); backdrop-filter:blur(16px); }
.dark-header .site-header { position:absolute; inset:0 0 auto; color:#fff; background:linear-gradient(rgba(2,27,29,.52),transparent); border-color:rgba(255,255,255,.24); }
.brand,.admin-brand { display:flex; align-items:center; gap:12px; font-family:var(--font-display),serif; font-size:24px; line-height:.95; letter-spacing:-.5px; }
.brand strong,.admin-brand strong { font-style:italic; }
.brand small,.admin-brand small { display:block; margin-top:7px; font:700 8px/1 var(--font-sans); letter-spacing:2.1px; text-transform:uppercase; }
.brand-mark { width:44px; height:44px; border:1px solid currentColor; border-radius:50%; display:block; position:relative; overflow:hidden; flex:0 0 auto; }
.brand-mark i,.brand-mark b { position:absolute; width:48px; height:18px; border:2px solid currentColor; border-radius:50%; left:-4px; }
.brand-mark i { bottom:7px; }.brand-mark b { bottom:0; opacity:.55; }
.site-header nav { display:flex; align-items:center; gap:clamp(20px,2.6vw,42px); font-size:12px; font-weight:700; letter-spacing:.7px; }
.site-header nav a { padding:12px 0; }
.site-header .nav-book { border:1px solid currentColor; border-radius:30px; padding:13px 22px; }
.hero { min-height:850px; height:100vh; color:white; position:relative; overflow:hidden; display:flex; align-items:center; }
.hero-image,.hero-shade { position:absolute; inset:0; height:100%; object-fit:cover; }
.hero-video { z-index:1; object-position:center; }
.hero-poster { z-index:0; }
.hero-shade { z-index:2; background:linear-gradient(90deg,rgba(3,32,34,.82) 0%,rgba(4,43,46,.42) 45%,rgba(2,25,27,.04) 78%),linear-gradient(0deg,rgba(1,28,30,.7),transparent 42%); }
.hero-content { width:min(720px,78vw); position:relative; z-index:3; margin-left:clamp(28px,8vw,132px); padding-top:76px; }
.hero-kicker,.eyebrow { display:inline-flex; align-items:center; gap:10px; text-transform:uppercase; letter-spacing:2.8px; font-size:10px; font-weight:800; }
.hero-kicker i,.admin-status i { width:7px; height:7px; background:var(--sand); border-radius:50%; box-shadow:0 0 0 5px rgba(233,189,104,.18); }
.hero h1 { margin:24px 0; font-size:clamp(62px,7.4vw,126px); line-height:.82; letter-spacing:-6px; font-weight:650; }
.hero h1 em { color:var(--sand); }
.hero-content>p { width:min(580px,90%); font-size:17px; line-height:1.7; color:rgba(255,255,255,.85); }
.hero-actions { display:flex; gap:12px; margin-top:34px; }
.button { min-height:52px; padding:0 26px; display:inline-flex; align-items:center; justify-content:center; gap:28px; border:0; border-radius:2px; font-size:12px; font-weight:800; letter-spacing:.4px; cursor:pointer; transition:.2s ease; }
.button:hover { transform:translateY(-2px); filter:brightness(1.03); }
.button-primary { background:var(--coral); color:white; box-shadow:0 12px 30px rgba(240,111,80,.22); }
.button-ghost { border:1px solid rgba(255,255,255,.5); color:white; }
.button-sand { background:var(--sand); color:var(--deep); }
.hero-facts { position:absolute; z-index:3; right:clamp(28px,5vw,84px); bottom:58px; display:flex; gap:1px; background:rgba(255,255,255,.22); }
.hero-facts div { width:190px; min-height:108px; padding:22px; display:grid; grid-template-columns:34px 1fr; background:rgba(6,40,43,.76); backdrop-filter:blur(14px); }
.hero-facts span { color:var(--sand); font:italic 22px/1 var(--font-display); grid-row:1/3; }.hero-facts strong { font-size:11px; }.hero-facts small { font-size:9px; margin-top:7px; opacity:.65; }
.scroll-cue { position:absolute; left:clamp(28px,8vw,132px); bottom:66px; z-index:3; text-transform:uppercase; letter-spacing:2px; font-size:8px; font-weight:800; display:flex; gap:22px; align-items:center; }
.video-credit { position:absolute; right:clamp(28px,5vw,84px); bottom:31px; z-index:3; color:rgba(255,255,255,.55); font-size:8px; letter-spacing:.5px; }
.section { padding:120px clamp(24px,7vw,112px); }
.section-heading h2 { font-size:clamp(46px,6vw,88px); line-height:.98; letter-spacing:-4px; margin:16px 0 0; }.section-heading h2 em { color:var(--coral); }
.section-lead { width:min(670px,100%); margin:32px 0 58px auto; font-size:17px; line-height:1.8; color:#55706e; }
.destination-grid { display:grid; grid-template-columns:repeat(12,1fr); grid-template-rows:460px 380px; grid-auto-rows:380px; gap:14px; }
.destination-card { position:relative; grid-column:span 4; overflow:hidden; color:white; min-height:360px; }.destination-card img,.card-shade { position:absolute; inset:0; height:100%; object-fit:cover; transition:.5s ease; }.destination-card:hover img { transform:scale(1.035); }
.card-shade { background:linear-gradient(0deg,rgba(2,30,31,.88),rgba(2,30,31,.05) 70%); }
.destination-1 { grid-column:span 7; }.destination-2 { grid-column:span 5; }.destination-3,.destination-4,.destination-5 { grid-column:span 4; }
.destination-card:last-child:nth-child(3n) { grid-column:span 12; }
.destination-card:nth-child(3n):nth-last-child(2),.destination-card:last-child:nth-child(3n + 1) { grid-column:span 6; }
.card-copy h3 { overflow-wrap:anywhere; }
.card-number { position:absolute; top:22px; right:22px; font:italic 20px var(--font-display); opacity:.8; }.card-copy { position:absolute; inset:auto 26px 26px; }.card-copy small { text-transform:uppercase; letter-spacing:2px; font-size:8px; color:var(--sand); }.card-copy h3 { font:500 clamp(28px,3vw,46px)/1 var(--font-display); margin:10px 0; }.card-copy p { max-width:500px; font-size:12px; line-height:1.55; color:rgba(255,255,255,.78); margin:0 0 16px; }.card-copy a { font-size:9px; font-weight:800; text-transform:uppercase; letter-spacing:1.5px; }
.whale-section { display:grid; grid-template-columns:1.08fr .92fr; min-height:820px; background:var(--deep); color:white; }.whale-photo { position:relative; min-height:620px; overflow:hidden; }.whale-photo img { height:100%; object-fit:cover; object-position:61% center; filter:saturate(.85); }.new-badge { position:absolute; top:32px; left:32px; padding:11px 15px; border-radius:30px; background:var(--coral); font-size:9px; font-weight:800; text-transform:uppercase; letter-spacing:1.4px; }
.whale-copy { padding:clamp(70px,8vw,128px); display:flex; flex-direction:column; align-items:flex-start; justify-content:center; }.eyebrow.light { color:var(--sand); }.whale-copy h2,.map-copy h2 { font-size:clamp(52px,6vw,86px); letter-spacing:-4px; line-height:.94; margin:20px 0 26px; }.whale-copy h2 em { color:#99d3c3; }.whale-copy>p { color:rgba(255,255,255,.69); line-height:1.8; }.whale-copy ul { list-style:none; margin:26px 0; padding:0; width:100%; border-top:1px solid rgba(255,255,255,.14); }.whale-copy li { padding:18px 0; display:flex; border-bottom:1px solid rgba(255,255,255,.14); }.whale-copy li b { width:120px; color:var(--sand); }.whale-copy li span { color:rgba(255,255,255,.66); }.whale-copy .ethics-note { display:flex; gap:12px; padding:16px; background:rgba(255,255,255,.06); font-size:10px; line-height:1.55; }.ethics-note span { color:var(--coral); font-size:21px; }
.festival-section { background:#f2d79d; display:grid; grid-template-columns:1fr 1fr; gap:7vw; position:relative; overflow:hidden; }.festival-pattern { position:absolute; width:48vw; height:48vw; right:-10vw; top:-16vw; border:90px double rgba(161,78,51,.15); transform:rotate(45deg); }.festival-copy,.weave-card { position:relative; z-index:1; }.festival-copy h2 { font-size:clamp(68px,9vw,132px); line-height:.74; letter-spacing:-7px; margin:35px 0; }.festival-copy h2 em { color:#a64735; }.festival-copy>p { max-width:620px; line-height:1.8; color:#624a3b; }.festival-date { margin-top:38px; display:flex; gap:25px; align-items:center; }.festival-date strong { font:italic 38px var(--font-display); color:#a64735; }.festival-date span { border-left:1px solid rgba(98,74,59,.3); padding-left:25px; font-size:10px; text-transform:uppercase; letter-spacing:1.5px; line-height:1.6; }
.weave-card { align-self:center; justify-self:end; width:min(420px,100%); padding:70px 52px; background:var(--deep); color:white; box-shadow:18px 18px 0 rgba(166,71,53,.6); }.weave-card>span { font-size:9px; letter-spacing:3px; text-transform:uppercase; color:var(--sand); }.weave-card strong { display:block; font:italic 88px var(--font-display); color:var(--sand); margin:10px 0 25px; }.weave-card p { font-size:13px; line-height:1.8; color:rgba(255,255,255,.68); }.weave-card a { display:inline-block; margin-top:28px; font-size:10px; text-transform:uppercase; letter-spacing:1.5px; font-weight:800; }
.gallery-section { background:var(--foam); }.gallery-grid { margin-top:42px; display:grid; grid-template-columns:repeat(4,1fr); gap:12px; }.gallery-item { margin:0; position:relative; aspect-ratio:1; overflow:hidden; }.gallery-item img,.gallery-item video { height:100%; object-fit:cover; }.gallery-item figcaption { position:absolute; inset:auto 0 0; padding:28px 18px 14px; color:white; font-size:11px; font-weight:700; background:linear-gradient(transparent,rgba(0,0,0,.65)); }
.map-section { display:grid; grid-template-columns:.8fr 1.2fr; background:#0a3d40; color:white; min-height:710px; }.map-copy { padding:clamp(70px,8vw,120px); }.map-copy>p { color:rgba(255,255,255,.68); line-height:1.75; }.route-list { margin:30px 0; border-top:1px solid rgba(255,255,255,.14); }.route-list span { padding:16px 0; display:grid; grid-template-columns:120px 1fr; border-bottom:1px solid rgba(255,255,255,.14); font-size:11px; color:rgba(255,255,255,.62); }.route-list b { color:white; }.map-frame { min-height:500px; position:relative; }.map-frame iframe { width:100%; height:100%; border:0; filter:sepia(.15) saturate(.8) contrast(.95); }.map-frame>span { position:absolute; top:28px; left:28px; padding:16px 20px; background:var(--paper); color:var(--ink); font-weight:800; box-shadow:0 8px 25px rgba(0,0,0,.18); }.map-frame small { display:block; margin-top:5px; font-weight:400; color:#71817f; }
.cta-section { padding:130px 25px; text-align:center; background:var(--paper); }.cta-section h2 { font-size:clamp(48px,7vw,100px); line-height:.95; letter-spacing:-5px; margin:20px 0; }.cta-section p { color:#657875; margin-bottom:32px; }
.site-footer { padding:70px clamp(24px,7vw,112px) 30px; display:grid; grid-template-columns:2fr 1fr 1fr; gap:50px; background:#061f21; color:white; }.site-footer h2 { margin:15px 0; font:500 38px var(--font-display); color:var(--sand); }.site-footer>div:not(.footer-brand) { display:flex; flex-direction:column; gap:10px; font-size:12px; }.site-footer>div strong { color:var(--sand); text-transform:uppercase; letter-spacing:1.5px; font-size:9px; margin-bottom:8px; }.site-footer a { color:rgba(255,255,255,.7); }.copyright { grid-column:1/-1; padding-top:24px; border-top:1px solid rgba(255,255,255,.1); margin:20px 0 0; color:rgba(255,255,255,.36); font-size:9px; }
.booking-page { min-height:760px; display:grid; grid-template-columns:.88fr 1.12fr; background:var(--foam); }.booking-intro { padding:90px clamp(32px,7vw,110px); background:var(--deep); color:white; }.booking-intro h1 { font-size:clamp(52px,6vw,86px); line-height:.94; letter-spacing:-4px; margin:24px 0; }.booking-intro h1 em { color:var(--sand); }.booking-intro>p { color:rgba(255,255,255,.68); line-height:1.8; }.contact-card { margin-top:38px; padding:28px; border:1px solid rgba(255,255,255,.15); background:rgba(255,255,255,.05); }.contact-card>span { display:block; text-transform:uppercase; letter-spacing:2px; font-size:8px; color:var(--sand); }.contact-card>a { display:block; font:500 35px var(--font-display); margin:10px 0 18px; }.contact-card div { display:flex; gap:8px; }.contact-card div a { padding:8px 12px; border:1px solid rgba(255,255,255,.2); border-radius:20px; font-size:9px; text-transform:uppercase; }.booking-tip { border-left:2px solid var(--coral); padding-left:16px; font-size:11px; }.booking-tip b { display:block; color:white; }
.booking-panel { padding:70px clamp(28px,6vw,90px); }.panel-head,.library-head { display:flex; justify-content:space-between; align-items:flex-end; margin-bottom:36px; }.panel-head span,.library-head h2 { font:500 34px var(--font-display); }.panel-head small { color:#7b8987; }.booking-form,.upload-panel { display:flex; flex-direction:column; gap:21px; }.form-row { display:grid; grid-template-columns:1fr 1fr; gap:18px; }.booking-form label,.upload-panel label { display:flex; flex-direction:column; gap:8px; font-size:9px; text-transform:uppercase; letter-spacing:1.4px; font-weight:800; }.booking-form input,.booking-form select,.booking-form textarea,.upload-panel input,.upload-panel select,.upload-panel textarea { width:100%; border:1px solid #c9d5d0; background:white; padding:14px 15px; color:var(--ink); border-radius:2px; outline:none; text-transform:none; letter-spacing:0; }.booking-form input:focus,.booking-form select:focus,.booking-form textarea:focus,.upload-panel input:focus,.upload-panel textarea:focus { border-color:var(--teal); box-shadow:0 0 0 3px rgba(15,91,93,.08); }.consent { flex-direction:row!important; align-items:flex-start; text-transform:none!important; letter-spacing:0!important; font-weight:500!important; line-height:1.5; color:#5f7471; }.consent input { width:auto!important; margin-top:2px; }.form-submit { align-self:flex-start; }.form-message { padding:14px; margin:0; font-size:12px; }.form-message.success { background:#d9eee2; color:#1f5a42; }.form-message.error { background:#fde1d9; color:#8b3624; }
.admin-shell { min-height:100vh; background:#f3f6f2; display:grid; grid-template-columns:260px 1fr; }.admin-sidebar { position:sticky; top:0; height:100vh; padding:28px 20px; background:var(--deep); color:white; display:flex; flex-direction:column; }.admin-brand { font-size:18px; padding:0 8px 28px; border-bottom:1px solid rgba(255,255,255,.1); }.admin-brand .brand-mark { width:38px; height:38px; }.admin-sidebar nav { display:flex; flex-direction:column; gap:7px; padding-top:28px; }.admin-sidebar nav button,.admin-sidebar nav a { border:0; background:transparent; color:rgba(255,255,255,.62); text-align:left; padding:13px 14px; display:flex; gap:12px; align-items:center; border-radius:5px; font-size:11px; cursor:pointer; }.admin-sidebar nav button.active { background:rgba(255,255,255,.1); color:white; }.admin-sidebar nav i { margin-left:auto; border-radius:20px; background:var(--coral); color:white; padding:2px 7px; font-style:normal; font-size:8px; }.admin-user { display:flex; gap:10px; align-items:center; margin-top:auto; border-top:1px solid rgba(255,255,255,.1); padding:22px 8px 0; }.admin-user>span { width:35px; height:35px; border-radius:50%; display:grid; place-items:center; background:var(--sand); color:var(--deep); font-weight:800; }.admin-user strong,.admin-user small { display:block; font-size:10px; }.admin-user small { color:rgba(255,255,255,.45); margin-top:4px; }.admin-main { padding:44px clamp(25px,5vw,72px); overflow:hidden; }.admin-top { display:flex; justify-content:space-between; align-items:center; }.admin-top h1 { font:500 46px var(--font-display); margin:8px 0 0; }.admin-status { display:flex; align-items:center; gap:8px; font-size:9px; text-transform:uppercase; letter-spacing:1px; }.admin-status i { background:#49a873; box-shadow:0 0 0 5px rgba(73,168,115,.13); }.admin-stats { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin:36px 0 24px; }.admin-stats article { background:white; padding:23px; border:1px solid #e0e7e2; }.admin-stats span,.admin-stats small { display:block; font-size:9px; color:#71817e; }.admin-stats strong { display:block; font:500 36px var(--font-display); margin:6px 0; }.admin-grid { display:grid; grid-template-columns:.9fr 1.1fr; gap:20px; }.upload-panel,.media-library,.bookings-table { background:white; border:1px solid #e0e7e2; padding:30px; }.upload-panel h2 { font:500 32px var(--font-display); margin:8px 0 10px; }.or { text-align:center; position:relative; color:#8c9997; font-size:8px; text-transform:uppercase; letter-spacing:1px; }.or:before { content:""; position:absolute; left:0; right:0; top:50%; border-top:1px solid #e0e7e2; }.or span { position:relative; background:white; padding:0 12px; }.admin-notice { margin:0; padding:12px; background:var(--foam); font-size:11px; }.library-head h2 { margin:8px 0 0; }.library-head>span { font-size:9px; color:#71817e; }.media-list { display:flex; flex-direction:column; gap:9px; max-height:610px; overflow:auto; }.media-list article { display:grid; grid-template-columns:72px 1fr 28px; gap:13px; align-items:center; padding:9px; background:#f6f8f5; }.media-list img,.media-list video { width:72px; height:54px; object-fit:cover; }.media-list strong,.media-list small { display:block; font-size:10px; }.media-list small { color:#82908e; margin-top:4px; }.media-list button { border:0; background:transparent; font-size:22px; cursor:pointer; }.empty-state { min-height:330px; display:flex; flex-direction:column; justify-content:center; align-items:center; text-align:center; color:#80908c; }.empty-state>span { font-size:42px; color:var(--mint); }.empty-state h3 { color:var(--ink); font:500 24px var(--font-display); margin:10px 0 5px; }.empty-state p { max-width:300px; font-size:11px; line-height:1.6; }.bookings-table { margin-top:36px; }.table-scroll { overflow:auto; }table { border-collapse:collapse; width:100%; font-size:11px; }th { text-align:left; text-transform:uppercase; letter-spacing:1px; font-size:8px; color:#7e8d8a; padding:12px; border-bottom:1px solid #dde5e1; }td { padding:15px 12px; border-bottom:1px solid #edf1ee; vertical-align:top; }td small { display:block; margin-top:5px; color:#7f8d8a; line-height:1.5; }.status-pill { padding:5px 9px; background:#fff1d5; color:#7b5719; border-radius:20px; text-transform:uppercase; font-size:8px; font-weight:800; }
@media (max-width:1000px) { .site-header nav a:not(.nav-book) { display:none; }.hero-facts { left:24px; right:24px; bottom:22px; }.scroll-cue { display:none; }.destination-grid { grid-template-rows:none; }.destination-card { grid-column:span 6!important; }.destination-1 { grid-column:span 12!important; }.whale-section,.festival-section,.map-section,.booking-page { grid-template-columns:1fr; }.whale-photo { min-height:560px; }.map-frame { min-height:550px; }.festival-pattern { width:80vw;height:80vw; }.admin-grid { grid-template-columns:1fr; } }
@media (max-width:720px) { .site-header { height:76px; padding:0 18px; }.brand { font-size:19px; }.brand-mark { width:38px; height:38px; }.site-header .nav-book { padding:10px 14px; }.hero { min-height:760px; height:100svh; align-items:flex-start; }.hero-content { width:auto; margin:0 23px; padding-top:170px; }.hero h1 { font-size:61px; letter-spacing:-4px; }.hero-content>p { font-size:14px; }.hero-actions { flex-wrap:wrap; }.hero-facts { display:none; }.section { padding:78px 20px; }.section-heading h2 { letter-spacing:-3px; }.section-lead { margin:25px 0 38px; }.destination-grid { display:block; }.destination-card { margin-bottom:12px; min-height:440px; }.whale-copy,.map-copy { padding:70px 23px; }.festival-section { padding:80px 23px; }.festival-copy h2 { letter-spacing:-5px; }.weave-card { padding:45px 32px; }.gallery-grid { grid-template-columns:1fr 1fr; }.map-frame { min-height:430px; }.site-footer { grid-template-columns:1fr; gap:30px; }.booking-intro,.booking-panel { padding:60px 23px; }.form-row { grid-template-columns:1fr; }.admin-shell { display:block; }.admin-sidebar { position:relative; height:auto; }.admin-sidebar nav { flex-direction:row; overflow:auto; }.admin-sidebar nav button,.admin-sidebar nav a { white-space:nowrap; }.admin-user { display:none; }.admin-main { padding:28px 15px; }.admin-top h1 { font-size:36px; }.admin-status { display:none; }.admin-stats { grid-template-columns:1fr 1fr 1fr; }.admin-stats article { padding:15px; }.admin-stats strong { font-size:28px; }.upload-panel,.media-library,.bookings-table { padding:20px; } }
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; }.hero-video { display:none; } }