/* VK Blooming Flower (18 Oct 2026, Hero first). Bright white shop, blush wrap, the gold serif of their wall sign,
   deep lily pink for the one button, the green of their marble floor for the calm parts. */
:root{
  --ink:#2a1c22;          /* text */
  --muted:#6e5d63;        /* second lines */
  --lily:#9b2457;         /* the stargazer lily: the one button, links */
  --gold:#9a7536;         /* the wall sign: the name and small labels only */
  --blush:#f7e7e4;        /* their blush wrapping paper */
  --marble:#1d3a33;       /* their green marble floor: sympathy and footer */
  --line:#ead9d6;
  --white:#fff;
  --bg:#ffffff;--accent:#9b2457;--on-accent:#ffffff; /* for the demo profiles (tools/demo_profiles.py) */
  --display:"Cormorant",Georgia,"Times New Roman",serif;
  --body:"Mulish",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --gut:20px;--max:1200px;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--white);color:var(--ink);font:16px/1.6 var(--body);-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%;height:auto}
a{color:inherit}
[hidden]{display:none!important}
input,button,select,textarea{font-family:inherit}
:focus-visible{outline:2px solid var(--lily);outline-offset:3px}
.wrap{max-width:var(--max);margin:0 auto;padding:0 var(--gut)}
.skip{position:absolute;left:-9999px}.skip:focus{left:12px;top:12px;z-index:9;background:#fff;padding:8px 12px}

/* type: big Cormorant (close to the serif of their gold wall letters), small gold caps above it */
h1,h2,h3{font-family:var(--display);font-weight:500;color:var(--ink);margin:0;text-wrap:balance;letter-spacing:-.015em}
h2{font-size:clamp(38px,10vw,58px);line-height:1.02}
h3{font-size:26px;line-height:1.15}
.caps{font:700 11.5px/1.2 var(--body);letter-spacing:.2em;text-transform:uppercase;color:var(--gold);margin:0}
.lede{color:var(--muted);margin:12px 0 0;max-width:34em}
.sec{padding:72px 0}
.sec-head{display:flex;flex-direction:column;gap:10px;margin-bottom:28px}

/* buttons: one filled lily-pink block per screen, everything else a text link */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:54px;padding:0 28px;background:var(--lily);color:#fff;
  font:700 13px/1 var(--body);letter-spacing:.16em;text-transform:uppercase;text-decoration:none;border:0;border-radius:0;cursor:pointer;transition:opacity .15s,transform .1s}
.btn:hover{opacity:.9}.btn:active{transform:scale(.98)}
.link{font-weight:700;color:var(--lily);text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1px}
.acts{display:flex;align-items:center;gap:18px;flex-wrap:wrap}

/* header: white bar, their name in the sign's gold serif */
.head{position:sticky;top:0;z-index:5;background:rgba(255,255,255,.96);border-bottom:1px solid transparent;transition:border-color .2s}
.head.scrolled{border-bottom-color:var(--line)}
.head .wrap{display:flex;align-items:center;justify-content:space-between;min-height:60px;max-width:1920px}
.brand{font:600 23px/1 var(--display);color:var(--gold);text-decoration:none;white-space:nowrap;letter-spacing:.005em}
.brand b{font-weight:400;letter-spacing:.08em;margin-right:.2em}
.head nav{display:none}
.head .order{display:inline-flex;align-items:center;min-height:44px;font:700 13px/1 var(--body);letter-spacing:.12em;text-transform:uppercase;text-decoration:underline;text-decoration-thickness:1.5px;text-underline-offset:6px;padding:0 0 0 12px}
@media (min-width:900px){
  :root{--gut:48px}
  .head .wrap{min-height:84px}.brand{font-size:28px}
  .head nav{display:flex;align-items:center;gap:30px;font-size:15px}.head nav a{text-decoration:none}.head nav a:hover{text-decoration:underline;text-underline-offset:5px}
  .head nav a[aria-current]{text-decoration:underline;text-underline-offset:5px}
  .head .order{display:none}
  .sec{padding:96px 0}
  h2{font-size:clamp(46px,4.4vw,64px)}
}

/* specials banner (the owner writes it in my.sitesbyleo.com.au) */
.special{background:var(--lily);color:#fff;text-align:center;font-size:14.5px}.special p{margin:0;padding:10px 0}

/* footer: the green of their floor */
.foot{background:var(--marble);color:#e9efec;padding:44px 0 36px;font-size:14.5px}
.foot .brand{color:#e8d2a3}
.foot .wrap{display:flex;flex-direction:column;gap:22px}
.foot nav{display:flex;flex-wrap:wrap;gap:10px 22px}
.foot nav a{text-decoration:none}
.foot small{font-size:13px;opacity:.85}
.foot small a{white-space:nowrap}
@media (min-width:900px){.foot .wrap{flex-direction:row;align-items:center;justify-content:space-between}.foot nav{flex:1;justify-content:center}.foot small{max-width:420px;text-align:right}}

/* bouquet cards (home best sellers, the shop, the gallery) */
.cards{display:grid;grid-template-columns:1fr 1fr;gap:26px 14px}
.card{display:flex;flex-direction:column;gap:8px;text-decoration:none;color:inherit;background:none;border:0;padding:0;text-align:left;cursor:pointer;font:inherit}
.card .ph{aspect-ratio:4/5;overflow:hidden;background:var(--blush)}
.card .ph img{width:100%;height:100%;object-fit:cover;object-position:50% 18%;transform:scale(1.1);transform-origin:50% 15%;transition:transform .5s ease}
.card:hover .ph img{transform:scale(1.13)}
.card .nm{font:500 22px/1.15 var(--display);color:var(--ink);margin-top:4px}
.card .pr{font-size:14.5px;color:var(--muted);font-variant-numeric:tabular-nums}
@media (min-width:900px){.cards{grid-template-columns:repeat(3,1fr);gap:44px 28px}.card .nm{font-size:25px}}

/* forms */
.field{display:flex;flex-direction:column;gap:8px;margin:0 0 20px;border:0;padding:0;min-width:0}
.field>label,.field>legend{font:700 14px/1.3 var(--body);color:var(--ink);padding:0}
.field small{color:var(--muted);font-size:13.5px;font-weight:400}
input[type=text],input[type=tel],input[type=email],input[type=date],input[type=time],select,textarea{width:100%;min-height:52px;padding:12px 14px;border:1px solid #d9c6c3;
  border-radius:0;background:#fff;color:var(--ink);font:16px/1.4 var(--body);-webkit-appearance:none;appearance:none}
textarea{min-height:110px;resize:vertical}
input:focus,select:focus,textarea:focus{outline:2px solid var(--lily);outline-offset:0;border-color:var(--lily)}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chips label{position:relative}
.chips input{position:absolute;opacity:0;inset:0;margin:0;cursor:pointer}
.chips span{display:inline-flex;align-items:center;gap:8px;min-height:46px;padding:0 16px;border:1px solid #d9c6c3;background:#fff;font-size:15px;cursor:pointer}
.chips input:checked+span{border-color:var(--lily);background:var(--lily);color:#fff}
.chips input:focus-visible+span{outline:2px solid var(--lily);outline-offset:2px}
.chips .dot{width:14px;height:14px;border-radius:50%;border:1px solid rgba(0,0,0,.12)}
.err{color:#9a2f2f;font-size:14px;margin:0 0 14px}
.sent{background:var(--blush);padding:18px;margin-top:18px}
.sent pre{white-space:pre-wrap;font:14.5px/1.5 var(--body);margin:10px 0 0}
.two{display:grid;gap:0 18px}
@media (min-width:700px){.two{grid-template-columns:1fr 1fr}}

/* motion: one gentle rise-in (standards/design.md, Motion) */
.rv-on .rv{opacity:0;transform:translateY(16px);transition:opacity .7s ease,transform .7s cubic-bezier(.2,.7,.2,1)}
.rv-on .rv.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.rv-on .rv{opacity:1;transform:none;transition:none}}