[hidden]{display:none!important}

/* Layout: phone-first app shell — sticky brand bar, one scrolling view, bottom tab bar; widens to a centred 760px column on desktop */
:root{
  --brand:#2B9BAA; --brand-ink:#13707C; --brand-soft:#E3F2F4;
  --bg:#F3F7F7; --surface:#FFFFFF; --surface-2:#EAF1F2; --line:#D6E2E3;
  --fg:#10292E; --muted:#5A7175; --on-brand:#FFFFFF;
  --ok:#2E8A57; --ok-soft:#E1F3E8; --warn:#B4740E; --warn-soft:#FBF0DC; --bad:#B4413A; --bad-soft:#F8E3E1; --info:#3D63B8; --info-soft:#E4EAF8;
  --f-display:"Sora", "Avenir Next", "Segoe UI", system-ui, sans-serif;
  --f-body:"Figtree", "Avenir Next", "Segoe UI", system-ui, sans-serif;
  --r:14px; --r-sm:10px;
  --shadow:0 1px 2px rgba(16,41,46,.06), 0 6px 20px rgba(16,41,46,.06);
}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){
  --brand:#4CC0CE; --brand-ink:#7FD6E0; --brand-soft:#123B41;
  --bg:#0B1618; --surface:#122326; --surface-2:#172D31; --line:#24403F;
  --fg:#E3F0F1; --muted:#93AEB2; --on-brand:#06272C;
  --ok:#5CC48A; --ok-soft:#14332A; --warn:#E3A748; --warn-soft:#382A12; --bad:#E57A72; --bad-soft:#3A1C1A; --info:#8AA8EE; --info-soft:#1A2440;
  --shadow:0 1px 2px rgba(0,0,0,.3), 0 6px 20px rgba(0,0,0,.25); color-scheme:dark}}
:root[data-theme="dark"]{
  --brand:#4CC0CE; --brand-ink:#7FD6E0; --brand-soft:#123B41;
  --bg:#0B1618; --surface:#122326; --surface-2:#172D31; --line:#24403F;
  --fg:#E3F0F1; --muted:#93AEB2; --on-brand:#06272C;
  --ok:#5CC48A; --ok-soft:#14332A; --warn:#E3A748; --warn-soft:#382A12; --bad:#E57A72; --bad-soft:#3A1C1A; --info:#8AA8EE; --info-soft:#1A2440;
  --shadow:0 1px 2px rgba(0,0,0,.3), 0 6px 20px rgba(0,0,0,.25); color-scheme:dark}
*{box-sizing:border-box}
html,body{background:var(--bg)}
body{color:var(--fg);font-family:var(--f-body);font-size:16px;line-height:1.5;-webkit-font-smoothing:antialiased}
h1,h2,h3{font-family:var(--f-display);line-height:1.2;text-wrap:balance;margin:0;letter-spacing:-.01em}
h1{font-size:1.75rem;font-weight:700} h2{font-size:1.3rem;font-weight:600} h3{font-size:1.05rem;font-weight:600}
p{margin:0}
button,input,select,textarea{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--brand);outline-offset:2px}
.num{font-variant-numeric:tabular-nums}
.muted{color:var(--muted)}
.small{font-size:.875rem}
.eyebrow{font-size:.75rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--brand-ink)}

/* shell */
.topbar{position:sticky;top:env(safe-area-inset-top,0px);z-index:20;background:color-mix(in srgb,var(--bg) 88%,transparent);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.topbar-in{max-width:760px;margin:0 auto;padding:10px 16px;display:flex;align-items:center;gap:12px}
.logo{display:block;background:var(--brand);-webkit-mask:url("logo-full.png") center/contain no-repeat;mask:url("logo-full.png") center/contain no-repeat}
.logo-mark{display:block;background:var(--brand);-webkit-mask:url("logo-mark.png") center/contain no-repeat;mask:url("logo-mark.png") center/contain no-repeat}
.topbar .logo{width:104px;height:39px}
.topbar .spacer{flex:1}
.cur{display:flex;border:1px solid var(--line);border-radius:999px;overflow:hidden;background:var(--surface)}
.cur button{border:0;background:none;padding:5px 11px;font-size:.8rem;font-weight:600;color:var(--muted);cursor:pointer}
.cur button[aria-pressed="true"]{background:var(--brand);color:var(--on-brand)}
main{max-width:760px;margin:0 auto;padding:20px 16px calc(110px + env(safe-area-inset-bottom,0px))}
.view{display:flex;flex-direction:column;gap:20px}
.tabbar{position:fixed;left:0;right:0;bottom:0;z-index:30;background:var(--surface);border-top:1px solid var(--line);padding-bottom:env(safe-area-inset-bottom,0px)}
.tabbar-in{max-width:760px;margin:0 auto;display:grid;grid-template-columns:repeat(var(--tabs,5),1fr)}
.tab{border:0;background:none;padding:8px 2px 9px;display:flex;flex-direction:column;align-items:center;gap:3px;font-size:.7rem;font-weight:600;color:var(--muted);cursor:pointer}
.tab svg{width:23px;height:23px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.tab[aria-current="page"]{color:var(--brand-ink)}

/* components */
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:18px;box-shadow:var(--shadow)}
.plain{background:var(--surface);border:1px solid var(--line);border-radius:var(--r)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border-radius:12px;border:1px solid transparent;padding:12px 18px;font-weight:600;cursor:pointer;text-decoration:none;min-height:46px}
.btn-primary{background:var(--brand);color:var(--on-brand)}
.btn-primary:hover{filter:brightness(1.05)}
.btn-ghost{background:var(--surface);border-color:var(--line);color:var(--fg)}
.btn-sm{padding:7px 12px;min-height:34px;font-size:.875rem;border-radius:10px}
.btn[disabled]{opacity:.5;cursor:not-allowed}
.row{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.stack{display:flex;flex-direction:column;gap:12px}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media (max-width:520px){.grid2{grid-template-columns:1fr}}
label.f{display:flex;flex-direction:column;gap:6px;font-size:.875rem;font-weight:600;min-width:0}
.input, select.input, textarea.input{width:100%;background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:11px 12px;font-weight:400;font-size:1rem;min-height:46px}
textarea.input{min-height:90px;resize:vertical}
.pill{display:inline-flex;align-items:center;gap:6px;border-radius:999px;padding:3px 10px;font-size:.75rem;font-weight:600;white-space:nowrap}
.pill::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}
.s-new{background:var(--info-soft);color:var(--info)}
.s-contacted,.s-quoted{background:var(--warn-soft);color:var(--warn)}
.s-consult,.s-called,.s-deposit,.s-travel{background:var(--brand-soft);color:var(--brand-ink)}
.s-done{background:var(--ok-soft);color:var(--ok)}
.s-lost{background:var(--bad-soft);color:var(--bad)}
.tag{font-size:.7rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;border:1px solid var(--line);color:var(--muted);border-radius:6px;padding:1px 6px}
.notice{border-radius:var(--r-sm);padding:12px 14px;font-size:.9rem;background:var(--surface-2);border:1px solid var(--line)}
.notice.warn{background:var(--warn-soft);border-color:transparent}
.notice.ok{background:var(--ok-soft);border-color:transparent}
.divider{height:1px;background:var(--line);margin:4px 0}

/* home */
.hero{display:flex;flex-direction:column;gap:14px;padding-top:6px}
.hero .logo{width:min(220px,60vw);height:82px;margin-left:-4px}
.hero h1{font-size:clamp(1.7rem,6vw,2.3rem)}
.hero p{font-size:1.05rem;color:var(--muted);max-width:56ch}
.steps{display:grid;gap:0;counter-reset:s}
.step{display:grid;grid-template-columns:36px 1fr;gap:14px;padding:14px 0;border-top:1px solid var(--line)}
.step:first-child{border-top:0;padding-top:4px}
.step-n{width:32px;height:32px;border-radius:50%;background:var(--brand-soft);color:var(--brand-ink);font-family:var(--f-display);font-weight:700;display:grid;place-items:center}
.facts{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.fact{padding:14px;border-radius:var(--r-sm);background:var(--surface);border:1px solid var(--line)}
.fact b{display:block;font-family:var(--f-display);font-size:1.15rem}
@media (max-width:520px){.facts{grid-template-columns:1fr}}

/* packages */
.bundle{display:flex;flex-direction:column;gap:12px}
.bundle-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}
.price{font-family:var(--f-display);font-weight:700;font-size:1.6rem;white-space:nowrap}
.price small{font-family:var(--f-body);font-size:.75rem;font-weight:600;color:var(--muted);margin-left:4px}
.bundle.featured{border:2px solid var(--brand)}
.checks{list-style:none;padding:0;margin:0;display:grid;gap:6px;font-size:.92rem}
.checks li{display:grid;grid-template-columns:18px 1fr;gap:8px}
.checks li::before{content:"";width:14px;height:14px;margin-top:4px;border-radius:50%;background:var(--brand-soft);box-shadow:inset 0 0 0 4px var(--brand-soft),inset 0 0 0 7px var(--brand)}
details.more summary{cursor:pointer;color:var(--brand-ink);font-weight:600;font-size:.9rem;list-style:none}
details.more summary::-webkit-details-marker{display:none}

/* builder */
.cat{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.cat>summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:10px;padding:15px 16px;font-weight:600}
.cat>summary::-webkit-details-marker{display:none}
.cat>summary .chev{margin-left:auto;transition:transform .2s;width:18px;height:18px;stroke:var(--muted);fill:none;stroke-width:2}
.cat[open]>summary .chev{transform:rotate(180deg)}
.cat .count{font-size:.75rem;font-weight:700;background:var(--brand);color:var(--on-brand);border-radius:999px;padding:1px 8px}
.items{border-top:1px solid var(--line)}
.item{display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:start;padding:13px 16px;border-top:1px solid var(--line);cursor:pointer}
.item:first-child{border-top:0}
.item input{appearance:none;-webkit-appearance:none;width:22px;height:22px;border-radius:7px;border:1.5px solid var(--line);background:var(--surface);margin:1px 0 0;display:grid;place-items:center;cursor:pointer}
.item input:checked{background:var(--brand);border-color:var(--brand)}
.item input:checked::after{content:"";width:6px;height:11px;border:solid var(--on-brand);border-width:0 2px 2px 0;transform:rotate(45deg) translate(-1px,-1px)}
.item input:disabled{background:var(--brand-soft);border-color:var(--brand-soft)}
.item.incl{cursor:default}
.item .nm{font-weight:600;font-size:.95rem}
.item .ds{font-size:.85rem;color:var(--muted);margin-top:2px}
.item .pr{font-weight:600;font-size:.92rem;text-align:right;white-space:nowrap}
.item .pr.in{color:var(--brand-ink);font-size:.8rem}
.quotebar{position:fixed;left:0;right:0;bottom:calc(60px + env(safe-area-inset-bottom,0px));z-index:25;pointer-events:none}
.quotebar-in{max-width:760px;margin:0 auto;padding:0 12px 10px}
.quotebar .qb{pointer-events:auto;display:flex;align-items:center;gap:12px;background:var(--fg);color:var(--bg);border-radius:16px;padding:10px 10px 10px 16px;box-shadow:0 10px 30px rgba(0,0,0,.25)}
.qb .t{font-family:var(--f-display);font-weight:700;font-size:1.2rem}
.qb .l{font-size:.75rem;opacity:.75}
.qb .btn{margin-left:auto;background:var(--brand);color:var(--on-brand)}
.qlines{display:grid;gap:0}
.ql{display:grid;grid-template-columns:1fr auto;gap:12px;padding:9px 0;border-top:1px solid var(--line);font-size:.93rem}
.ql:first-child{border-top:0}
.ql.total{font-weight:700;font-size:1.05rem;border-top:2px solid var(--fg)}
.ql .sub{font-size:.8rem;color:var(--muted)}

/* booking */
.days{display:flex;gap:8px;overflow-x:auto;padding:2px 2px 8px;scroll-snap-type:x mandatory}
.day{flex:0 0 auto;scroll-snap-align:start;border:1px solid var(--line);background:var(--surface);border-radius:12px;padding:8px 12px;text-align:center;cursor:pointer;min-width:64px}
.day b{display:block;font-family:var(--f-display);font-size:1.15rem}
.day span{font-size:.72rem;color:var(--muted);font-weight:600;text-transform:uppercase;letter-spacing:.05em}
.day[aria-pressed="true"]{background:var(--brand);border-color:var(--brand);color:var(--on-brand)}
.day[aria-pressed="true"] span{color:var(--on-brand)}
.slots{display:grid;grid-template-columns:repeat(auto-fill,minmax(92px,1fr));gap:8px}
.slot{border:1px solid var(--line);background:var(--surface);border-radius:10px;padding:10px 4px;font-weight:600;cursor:pointer;text-align:center}
.slot[aria-pressed="true"]{background:var(--brand);border-color:var(--brand);color:var(--on-brand)}
.slot[disabled]{opacity:.35;text-decoration:line-through;cursor:not-allowed}
.seg{display:flex;background:var(--surface-2);border-radius:12px;padding:3px;gap:3px}
.seg button{flex:1;border:0;background:none;border-radius:9px;padding:9px 6px;font-weight:600;font-size:.9rem;color:var(--muted);cursor:pointer}
.seg button[aria-pressed="true"]{background:var(--surface);color:var(--fg);box-shadow:var(--shadow)}

/* staff */
.kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.kpi{padding:14px;border-radius:var(--r-sm);background:var(--surface);border:1px solid var(--line)}
.kpi b{display:block;font-family:var(--f-display);font-size:1.4rem}
.kpi span{font-size:.78rem;color:var(--muted);font-weight:600}
@media (max-width:420px){.kpis{grid-template-columns:1fr 1fr}.kpis .kpi:last-child{grid-column:span 2}}
.chips{display:flex;gap:6px;overflow-x:auto;padding-bottom:4px}
.chip{flex:0 0 auto;border:1px solid var(--line);background:var(--surface);border-radius:999px;padding:6px 12px;font-size:.82rem;font-weight:600;cursor:pointer;color:var(--muted)}
.chip[aria-pressed="true"]{background:var(--fg);color:var(--bg);border-color:var(--fg)}
.lead{display:grid;grid-template-columns:1fr auto;gap:4px 12px;padding:14px 16px;border-top:1px solid var(--line);cursor:pointer;background:none;border-left:0;border-right:0;border-bottom:0;text-align:left;width:100%}
.lead:first-child{border-top:0}
.lead:hover{background:var(--surface-2)}
.lead .nm{font-weight:600;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lead .meta{font-size:.82rem;color:var(--muted);min-width:0}
.lead .amt{font-weight:700;text-align:right}
.sheet-bg{position:fixed;inset:0;background:rgba(5,15,17,.45);z-index:50;display:flex;align-items:flex-end;justify-content:center}
.sheet{background:var(--bg);width:100%;max-width:760px;max-height:92%;overflow-y:auto;border-radius:20px 20px 0 0;padding:8px 16px calc(24px + env(safe-area-inset-bottom,0px));display:flex;flex-direction:column;gap:16px}
.grab{width:40px;height:5px;border-radius:3px;background:var(--line);margin:4px auto 0}
.kv{display:grid;grid-template-columns:110px 1fr;gap:6px 12px;font-size:.92rem}
.kv dt{color:var(--muted)} .kv dd{margin:0;min-width:0;overflow-wrap:anywhere;user-select:text}
.tbl-wrap{overflow-x:auto}
table.tbl{width:100%;border-collapse:collapse;font-size:.85rem}
.tbl th,.tbl td{padding:7px 8px;border-top:1px solid var(--line);text-align:right;white-space:nowrap}
.tbl th:first-child,.tbl td:first-child{text-align:left;white-space:normal}
.tbl th{font-weight:600;color:var(--muted);border-top:0}
.appt{display:grid;grid-template-columns:64px 1fr auto;gap:12px;align-items:center;padding:12px 16px;border-top:1px solid var(--line)}
.appt:first-child{border-top:0}
.appt .tm{font-family:var(--f-display);font-weight:600}
.empty{padding:28px 18px;text-align:center;color:var(--muted);display:flex;flex-direction:column;gap:8px;align-items:center}
.toast{position:fixed;left:50%;bottom:calc(140px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);background:var(--fg);color:var(--bg);padding:10px 16px;border-radius:12px;font-weight:600;font-size:.9rem;z-index:60;max-width:calc(100% - 32px)}
.fine{font-size:.78rem;color:var(--muted)}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

/* website additions */
.topnav{display:flex;align-items:center;gap:4px}
.navlink{color:var(--muted);text-decoration:none;font-weight:600;font-size:.92rem;padding:8px 10px;border-radius:8px}
.navlink:hover{color:var(--fg);background:var(--surface-2)}
.navlink[aria-current="page"]{color:var(--brand-ink)}
.topbar .btn{text-decoration:none}
.site-footer{max-width:760px;margin:0 auto;padding:0 16px calc(120px + env(safe-area-inset-bottom,0px));display:flex;flex-direction:column;gap:8px;color:var(--muted);font-size:.85rem}
.site-footer .row a{color:var(--brand-ink)}
#contactline{display:flex;gap:16px;flex-wrap:wrap}
main{padding-bottom:32px}
@media (max-width:819px){.topnav .navlink{display:none}}
@media (min-width:820px){
  .tabbar{display:none}
  .quotebar{bottom:0}
  .site-footer{padding-bottom:110px}
  .topbar-in,main,.site-footer,.quotebar-in{max-width:960px}
}
.noscript{padding:24px 16px;max-width:760px;margin:0 auto}
