/* Med Lipa - Origami Fold design system */
:root{
  --c-paper:#fbf7ef;
  --c-paper-dark:#f1e9d8;
  --c-petrol:#1d4e52;
  --c-petrol-dark:#123236;
  --c-petrol-light:#2f6c71;
  --c-apricot:#e2973f;
  --c-apricot-light:#f3b86a;
  --c-apricot-dark:#c0721e;
  --c-beige:#e7dcc3;
  --c-ink:#20291f;
  --c-line:#d8cdb3;
  --font-display:"Iowan Old Style","Palatino Linotype",Georgia,serif;
  --font-body:"Avenir Next","Segoe UI",system-ui,sans-serif;
  --font-mono:"JetBrains Mono",ui-monospace,Menlo,monospace;
  --radius:4px;
  --shadow-paper:0 10px 30px -12px rgba(18,50,54,.35);
  --measure:42em;
}
html,body{overflow-x:clip}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--c-paper);color:var(--c-ink);font-family:var(--font-body);line-height:1.55;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:var(--c-petrol);text-decoration:none}
h1,h2,h3{font-family:var(--font-display);margin:0 0 .5em;line-height:1.1}
p{margin:0 0 1em}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}
.skip-link{position:absolute;left:-999px;top:0;background:var(--c-petrol-dark);color:#fff;padding:.6em 1em;z-index:200}
.skip-link:focus{left:0}
:focus-visible{outline:3px solid var(--c-apricot);outline-offset:2px}
.container{max-width:1200px;margin-inline:auto;padding-inline:clamp(1rem,4vw,2.5rem)}
.u-mt-0{margin-top:0}.u-mt-1{margin-top:1rem}.u-mt-2{margin-top:2rem}.u-mt-3{margin-top:3rem}
.u-mb-0{margin-bottom:0}.u-mb-1{margin-bottom:1rem}.u-mb-2{margin-bottom:2rem}.u-mb-3{margin-bottom:3rem}
.u-grid{display:grid;gap:clamp(1rem,3vw,2.5rem)}
.u-grid-2{grid-template-columns:1fr}
.u-grid-3{grid-template-columns:1fr}
@media(min-width:720px){.u-grid-2{grid-template-columns:1fr 1fr}.u-grid-3{grid-template-columns:repeat(3,1fr)}}
.icon{stroke:currentColor;fill:none;flex:none}

/* ---------- Header ---------- */
.site-header{position:sticky;top:0;z-index:100;background:rgba(251,247,239,.92);backdrop-filter:blur(6px);border-bottom:1px solid var(--c-line)}
.site-header__inner{max-width:1200px;margin-inline:auto;padding:.8rem clamp(1rem,4vw,2.5rem);display:flex;align-items:center;justify-content:space-between;gap:1rem}
.logo{display:flex;align-items:center;gap:.5rem;color:var(--c-ink)}
.logo__mark{width:36px;height:36px;aspect-ratio:1/1}
.logo__word{font-family:var(--font-display);font-size:1.3rem;letter-spacing:.01em}
.logo__word em{font-style:italic;color:var(--c-apricot-dark)}
.logo__word--footer{font-size:1.5rem;color:#fff}
.logo__word--footer em{color:var(--c-apricot-light)}
.nav{display:flex;align-items:center;gap:1.4rem}
.nav__toggle{display:none;background:none;border:none;color:var(--c-petrol-dark);padding:.4rem;cursor:pointer}
.nav__toggle .icon--close{display:none}
.nav__list{display:flex;gap:1.4rem;list-style:none;margin:0;padding:0;font-size:.95rem}
.nav__list a{position:relative;color:var(--c-ink);padding:.3em 0}
.nav__list a::after{content:"";position:absolute;left:0;bottom:-2px;width:100%;height:2px;background:var(--c-apricot);transform:scaleX(0);transform-origin:left;transition:transform .3s ease}
.nav__list a:hover::after,.nav__list a.is-active::after{transform:scaleX(1)}
.nav__list a.is-active{color:var(--c-petrol-dark);font-weight:600}
.cart-link{display:flex;align-items:center;gap:.3em;color:var(--c-petrol-dark)}
.cart-count{display:inline-flex;align-items:center;justify-content:center;min-width:20px;height:20px;padding:0 5px;border-radius:50%;background:var(--c-apricot);color:#20291f;font-size:.75rem;font-weight:700}
.cart-count--bump{animation:bump .35s ease}
@keyframes bump{0%{transform:scale(1)}40%{transform:scale(1.4)}100%{transform:scale(1)}}
@media(max-width:860px){
  .nav__toggle{display:flex}
  .nav__list{position:fixed;inset:0 0 0 auto;width:min(78vw,320px);flex-direction:column;gap:0;background:var(--c-petrol-dark);padding:5rem 1.5rem 2rem;transform:translateX(100%);visibility:hidden;transition:transform .35s ease;z-index:150}
  .nav--open .nav__list{transform:translateX(0);visibility:visible}
  .nav__list a{color:#fff;display:block;padding:.8em 0;border-bottom:1px solid rgba(255,255,255,.12)}
  .nav--open .nav__toggle .icon--open{display:none}
  .nav--open .nav__toggle .icon--close{display:block}
  .nav--open{position:relative}
}

/* ---------- Buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5em;font-family:var(--font-body);font-weight:600;font-size:.95rem;padding:.75em 1.6em;border-radius:var(--radius);border:1.5px solid transparent;cursor:pointer;position:relative;overflow:hidden;isolation:isolate;min-height:44px}
.btn--sweep{background:var(--c-petrol-dark);color:#fff}
.btn--sweep::before{content:"";position:absolute;inset:0;width:100%;left:-100%;background:var(--c-apricot);z-index:-1;transition:left .35s ease}
.btn--sweep:hover::before,.btn--sweep:focus-visible::before{left:0}
.btn--sweep:hover,.btn--sweep:focus-visible{color:var(--c-petrol-dark)}
.btn--outline{background:transparent;border-color:var(--c-petrol-dark);color:var(--c-petrol-dark)}
.btn--outline:hover{background:var(--c-petrol-dark);color:#fff}
.btn--ghost{background:transparent;border-color:rgba(255,255,255,.5);color:#fff}
.btn--ghost:hover{background:rgba(255,255,255,.15)}
.btn--sm{padding:.45em 1em;font-size:.85rem;min-height:36px}
.btn[disabled]{opacity:.5;cursor:not-allowed}

/* ---------- Hero / page-hero ---------- */
.hero{position:relative;padding:clamp(3rem,8vw,6rem) 0 clamp(2.5rem,6vw,4rem)}
.hero__headline{font-size:clamp(2.4rem,6vw,4.6rem);max-width:14ch}
.hero__underline{position:relative;display:inline-block}
.hero__underline svg{position:absolute;left:0;bottom:-.08em;width:100%;height:.3em;overflow:visible}
.hero__underline path{stroke:var(--c-apricot);stroke-width:6;fill:none;stroke-dasharray:420;stroke-dashoffset:420;animation:draw 1.1s .3s ease forwards}
@media(prefers-reduced-motion:reduce){.hero__underline path{animation:none;stroke-dashoffset:0}}
@keyframes draw{to{stroke-dashoffset:0}}
.page-hero{background:var(--c-petrol-dark);color:#fff;padding:clamp(2.6rem,6vw,4rem) 0;position:relative;overflow:hidden}
.page-hero h1{color:#fff}
.page-hero p{color:#e4e0d2;max-width:38em}
.page-hero .breadcrumbs a,.page-hero .breadcrumbs span{color:#cbd8d4}

/* ---------- Breadcrumbs ---------- */
.breadcrumbs{display:flex;gap:.5em;font-size:.85rem;list-style:none;padding:0;margin:0 0 1em;flex-wrap:wrap}
.breadcrumbs li:not(:last-child)::after{content:"/";margin-left:.5em;opacity:.5}
.breadcrumbs a{text-decoration:underline}

/* ---------- Prose / legal ---------- */
.prose{max-width:var(--measure);font-size:1.02rem}
.prose h2{margin-top:2em;font-size:1.5rem}
.prose h3{margin-top:1.5em;font-size:1.15rem}
.prose ul,.prose ol{padding-left:1.3em}
.legal-toc{background:var(--c-paper-dark);border:1px solid var(--c-line);border-radius:var(--radius);padding:1.2em 1.4em;max-width:var(--measure)}
.legal-toc h2{margin-top:0;font-size:1rem;text-transform:uppercase;letter-spacing:.04em}
.legal-toc ol{margin:0;padding-left:1.3em}

/* ---------- Notice ---------- */
.notice{border-radius:var(--radius);padding:1em 1.2em;border:1.5px solid var(--c-line);background:var(--c-paper-dark);max-width:var(--measure)}
.notice--info{border-color:var(--c-petrol-light)}
.notice--warn{border-color:var(--c-apricot-dark);background:#fbeedd}

/* ---------- Cards / products ---------- */
.card{background:#fff;border-radius:var(--radius);border:1px solid var(--c-line);overflow:hidden;box-shadow:var(--shadow-paper);transition:transform .3s ease,box-shadow .3s ease}
.card:hover{transform:translateY(-4px)}
.product-card{display:flex;flex-direction:column}
.product-card__media{aspect-ratio:4/3;overflow:hidden;position:relative}
.product-card__media img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease}
.product-card:hover .product-card__media img{transform:scale(1.07)}
.product-card__body{padding:1.1em 1.2em 1.4em;display:flex;flex-direction:column;gap:.4em;flex:1}
.product-card__price{font-weight:700;color:var(--c-apricot-dark)}
.product-strip{display:flex;gap:1.2rem;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:.5rem}
.product-strip .product-card{flex:0 0 min(78vw,300px);scroll-snap-align:start}
.product-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:1.4rem}

/* ---------- Product detail ---------- */
.product-detail{display:grid;gap:clamp(1.5rem,4vw,3rem);grid-template-columns:1fr}
@media(min-width:800px){.product-detail{grid-template-columns:1fr 1fr}}
.product-detail__media{aspect-ratio:4/3;border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow-paper)}
.product-detail__media img{width:100%;height:100%;object-fit:cover}
.product-detail__price{font-size:1.6rem;font-weight:700;color:var(--c-apricot-dark)}
.qty-control{display:flex;align-items:center;border:1.5px solid var(--c-line);border-radius:var(--radius);width:fit-content}
.qty-control button{background:none;border:none;width:44px;height:44px;font-size:1.2rem;cursor:pointer}
.qty-control input{width:48px;border:none;text-align:center;font-size:1rem;background:transparent}

/* ---------- Cart / checkout ---------- */
.cart-table{width:100%;border-collapse:collapse;margin-bottom:2rem}
.cart-table th,.cart-table td{padding:.8em .6em;border-bottom:1px solid var(--c-line);text-align:left;vertical-align:middle}
.cart-table img{width:64px;height:64px;object-fit:cover;border-radius:var(--radius)}
.cart-summary{background:var(--c-paper-dark);border:1px solid var(--c-line);border-radius:var(--radius);padding:1.4em;max-width:360px;margin-left:auto}
.cart-summary dl{display:flex;justify-content:space-between;margin:0 0 .6em}
.cart-summary dt,.cart-summary dd{margin:0}

/* ---------- Forms ---------- */
.form-grid{display:grid;gap:1.1rem;max-width:640px}
.field{display:flex;flex-direction:column;gap:.35em}
.field label{font-size:.9rem;font-weight:600}
.field input,.field select,.field textarea{font:inherit;padding:.7em .9em;border:1.5px solid var(--c-line);border-radius:var(--radius);background:#fff;accent-color:var(--c-apricot)}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--c-petrol)}
.field-error{color:#a3321f;font-size:.85rem;min-height:1.2em}
.form-msg{min-height:1.4em;font-size:.9rem}
.form-msg--ok{color:var(--c-petrol-dark)}
.form-msg--error{color:#a3321f}
.hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
.newsletter-form{display:flex;gap:.6em;flex-wrap:wrap}
.newsletter-form input[type=email]{flex:1;min-width:160px;padding:.7em .9em;border-radius:var(--radius);border:1.5px solid rgba(255,255,255,.3);background:rgba(255,255,255,.08);color:#fff}
.newsletter-form .form-msg{width:100%}

/* ---------- Contact layout ---------- */
.contact-layout{display:grid;gap:clamp(1.5rem,4vw,3rem);grid-template-columns:1fr}
@media(min-width:800px){.contact-layout{grid-template-columns:1.1fr .9fr}}
.contact-card{background:var(--c-paper-dark);border:1px solid var(--c-line);border-radius:var(--radius);padding:1.4em}
.contact-card ul{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:.8em}
.contact-card li{display:flex;gap:.6em;align-items:flex-start}

/* ---------- FAQ ---------- */
.faq{display:flex;flex-direction:column;gap:.8rem;max-width:var(--measure)}
.faq-item{border:1px solid var(--c-line);border-radius:var(--radius);background:#fff;padding:.2em .2em}
.faq-item summary{cursor:pointer;padding:.9em 1em;font-weight:600;list-style:none;display:flex;justify-content:space-between;gap:1em}
.faq-item summary::after{content:"+";font-size:1.3rem;color:var(--c-apricot-dark);transition:transform .25s ease}
.faq-item[open] summary::after{transform:rotate(45deg)}
.faq-item p{padding:0 1em 1em;margin:0;color:#444}

/* ---------- Footer ---------- */
.site-footer{background:var(--c-petrol-dark);color:#e7e2d3;position:relative;overflow:hidden}
.site-footer__grain{position:absolute;inset:0;width:100%;height:100%;opacity:.05;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");pointer-events:none}
.site-footer__inner{position:relative;max-width:1200px;margin-inline:auto;padding:3rem clamp(1rem,4vw,2.5rem) 2rem;display:grid;gap:2rem;grid-template-columns:1fr}
@media(min-width:900px){.site-footer__inner{grid-template-columns:1.2fr 2fr 1.2fr}}
.footer-brand p{color:#bcc8c4;max-width:26ch}
.footer-cols{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}
.footer-col h3{font-size:.85rem;text-transform:uppercase;letter-spacing:.06em;color:var(--c-apricot-light);margin-bottom:.7em}
.footer-col ul{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:.5em}
.footer-col a{color:#e7e2d3}
.footer-col a:hover{color:var(--c-apricot-light)}
.footer-newsletter h3{font-size:1rem;color:#fff}
.footer-newsletter p{color:#bcc8c4;font-size:.9rem}
.footer-mail{display:flex;align-items:center;gap:.5em;margin-top:.8em;color:#e7e2d3}
.site-footer__bottom{position:relative;border-top:1px solid rgba(255,255,255,.12);padding:1em clamp(1rem,4vw,2.5rem);font-size:.82rem;color:#9fb0ab}

/* ---------- Cookie banner ---------- */
.cookie-banner{position:fixed;left:1rem;right:1rem;bottom:1rem;z-index:300;background:var(--c-petrol-dark);color:#fff;border-radius:var(--radius);padding:1.1em 1.3em;display:flex;flex-wrap:wrap;gap:1em;align-items:center;justify-content:space-between;box-shadow:var(--shadow-paper);max-width:760px;margin-inline:auto}
.cookie-banner a{color:var(--c-apricot-light);text-decoration:underline}
.cookie-banner__actions{display:flex;gap:.6em}

/* ---------- Reveal / motion ---------- */
.reveal{opacity:1;transform:none}
.js .reveal{opacity:0;transform:translateY(24px);transition:opacity .6s ease,transform .6s ease}
.js .reveal.in-view{opacity:1;transform:none}
.js .reveal:nth-child(2){transition-delay:.08s}
.js .reveal:nth-child(3){transition-delay:.16s}
.js .reveal:nth-child(4){transition-delay:.24s}
@media(prefers-reduced-motion:reduce){.js .reveal{transition:none;opacity:1;transform:none}}

/* ---------- Bloom calendar (signature feature) ---------- */
.bloom{background:var(--c-beige);border-radius:var(--radius);padding:clamp(1.4rem,3vw,2.4rem);position:relative;overflow:hidden}
.bloom__track{display:flex;gap:.5rem;overflow-x:auto;padding-bottom:.6rem}
.bloom__month{flex:0 0 auto;border:1.5px solid var(--c-line);background:#fff;border-radius:var(--radius);padding:.6em 1em;cursor:pointer;font-weight:600;min-height:44px}
.bloom__month.is-active{background:var(--c-petrol-dark);color:#fff;border-color:var(--c-petrol-dark)}
.bloom__result{margin-top:1.2em;padding:1em 1.2em;background:#fff;border-radius:var(--radius);border:1px solid var(--c-line)}

/* ---------- Divider / decorative ---------- */
.divider{display:block;width:100%;height:28px;color:var(--c-apricot)}
.collage{position:relative}
.collage__caption{font-family:var(--font-mono);font-size:.75rem;letter-spacing:.05em;text-transform:uppercase;color:var(--c-petrol-dark);background:var(--c-paper);padding:.3em .6em;border:1px solid var(--c-line);display:inline-block}

/* COMPONENTS:
.container - max-width content wrapper with responsive padding
.u-grid / .u-grid-2 / .u-grid-3 - responsive grid helpers
.u-mt-*, .u-mb-* - spacing utilities (0/1/2/3)
.site-header / .nav / .nav__list / .nav__toggle - sticky header and responsive nav
.cart-link / .cart-count - header cart icon + animated badge
.btn / .btn--sweep / .btn--outline / .btn--ghost / .btn--sm - button variants, fill-sweep hover
.hero / .hero__headline / .hero__underline - home hero with drawn underline animation
.page-hero - dark hero band used on all inner pages
.breadcrumbs - inline breadcrumb trail
.prose - readable long-form legal/content text, max-width measure
.legal-toc - table of contents box for legal pages
.notice / .notice--info / .notice--warn - callout boxes
.card / .product-card / .product-card__media / .product-card__body - product card
.product-strip - horizontal scroll-snap product row (mobile)
.product-grid - responsive auto-fill product grid
.product-detail / .product-detail__media / .product-detail__price - product page layout
.qty-control - quantity stepper input
.cart-table / .cart-summary - cart/checkout page table and totals box
.form-grid / .field / .field-error / .form-msg - form layout and validation states
.newsletter-form - footer newsletter inline form
.hp - visually hidden honeypot field
.contact-layout / .contact-card - contact page split layout
.faq / .faq-item - details/summary accordion
.site-footer / .footer-brand / .footer-cols / .footer-col / .footer-newsletter - footer regions
.cookie-banner / .cookie-banner__actions - consent banner
.reveal / .in-view - scroll-reveal animation hook
.bloom / .bloom__track / .bloom__month / .bloom__result - Cvetni koledar signature feature
.divider - decorative SVG section divider
.collage / .collage__caption - home page asymmetric photo collage and caption chips
*/

/* ---------- Missing components ---------- */
.icon-sprite { display: none; }

.hero__grid {
  display: grid;
  gap: 2rem;
  grid-template-columns: 1fr;
  align-items: center;
}
@media(min-width: 800px) {
  .hero__grid { grid-template-columns: 1fr 1fr !important; }
}

.qty-btn {
  background: none;
  border: none;
  color: var(--c-petrol-dark);
  width: 44px;
  height: 44px;
  font-size: 1.2rem;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: color .2s ease;
}
.qty-btn:hover { color: var(--c-apricot-dark); }
.qty-btn--minus { }
.qty-input {
  width: 48px;
  border: none;
  text-align: center;
  font-size: 1rem;
  background: transparent;
  color: var(--c-ink);
  font: inherit;
}
.qty-btn--plus { }
