:root{
  --offwhite:#FAF9F6; --oat:#F0ECE3; --oat-deep:#E6E0D2;
  --ink:#1A1F1E; --ink-soft:rgba(26,31,30,.68);
  --icy:#D4FBFF; --icy-soft:#EAFDFF;
  --yellow:#FFE7A0; --yellow-deep:#F5D678; --pink:#FFDDE6;
  --display:'Hanyabolyfor','Caveat',cursive;
  --body:'Poppins',Arial,sans-serif;
  --radius:22px; --radius-lg:34px;
  --shadow:0 18px 44px -18px rgba(26,31,30,.16);
  --shadow-soft:0 10px 30px -14px rgba(26,31,30,.12);
  --max:1180px; --ease:cubic-bezier(.22,.8,.24,1); --page-max:1920px;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
/* The page has a ceiling. Past it the layout stops growing and sits centred
   on its own background, the way a shop or a paper does: zooming out then
   shows more margin, not a stretched hero with a thin column of text lost in
   the middle of it. Real monitors up to 1920 are untouched. */
body{font-family:var(--body);background:var(--offwhite);color:var(--ink);line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden;max-width:var(--page-max);margin-inline:auto}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
ul{list-style:none}
button{font-family:inherit;cursor:pointer;border:none;background:none}
.wrap{max-width:var(--max);margin:0 auto;padding:0 24px}
.display{font-family:var(--display);font-weight:700;line-height:.98;letter-spacing:-.01em}
h1.display{font-size:clamp(2.8rem,6.4vw,5rem)}
h2.display{font-size:clamp(2.2rem,4.6vw,3.6rem)}
.eyebrow{display:inline-flex;align-items:center;gap:8px;font-size:.78rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft)}
.eyebrow::before{content:'';width:26px;height:2px;background:var(--ink);opacity:.35;border-radius:2px}
.lede{font-size:clamp(1.02rem,1.6vw,1.2rem);color:var(--ink-soft);max-width:36em}
.section-head{max-width:640px;margin-bottom:clamp(32px,4.5vw,56px)}
.section-head .display{margin:14px 0 16px}
.btn{display:inline-flex;align-items:center;gap:10px;font-weight:600;font-size:1rem;padding:16px 30px;border-radius:999px;transition:transform .25s var(--ease),box-shadow .25s var(--ease),background .25s;will-change:transform}
.btn-primary{background:var(--yellow);color:var(--ink);box-shadow:0 12px 26px -12px rgba(245,214,120,.9)}
.btn-primary:hover{background:var(--yellow-deep);transform:translateY(-2px);box-shadow:0 18px 34px -12px rgba(245,214,120,.95)}
.btn-primary svg{transition:transform .25s var(--ease)}
.btn-primary:hover svg{transform:translateX(4px)}
.btn:focus-visible,a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid #74c7d3;outline-offset:3px;border-radius:6px}
header{position:sticky;top:0;z-index:60;background:rgba(250,249,246,.86);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid rgba(26,31,30,.06)}
.nav{max-width:var(--max);margin:0 auto;padding:14px 24px;display:flex;align-items:center;gap:28px}
/* The logo keeps its own width: the anchor is a flex item, and without
   these the global img{max-width:100%} let a tight row squash it. */
.nav-logo{flex-shrink:0}
.nav-logo img{height:30px;width:auto;max-width:none}
.nav-links{display:flex;gap:26px;font-size:.94rem;font-weight:500;margin-left:8px}
.nav-links a{opacity:.78;transition:opacity .2s;padding-bottom:2px}
.nav-links a:hover{opacity:1}
.nav-links a.active{opacity:1;border-bottom:2px solid var(--ink)}
.nav-right{margin-left:auto;display:flex;align-items:center;gap:16px}
.lang-toggle{display:flex;background:var(--oat);border-radius:999px;padding:3px}
.lang-toggle button{font-size:.78rem;font-weight:600;padding:6px 12px;border-radius:999px;color:var(--ink-soft);transition:all .2s}
.lang-toggle button.active{background:#fff;color:var(--ink);box-shadow:0 2px 8px rgba(26,31,30,.1)}
.nav-login{display:inline-flex;align-items:center;gap:7px;font-size:.9rem;font-weight:600;opacity:.8;transition:opacity .2s}
.nav-login:hover{opacity:1}
.nav .btn-primary{padding:11px 22px;font-size:.92rem}
.nav-burger{display:none;flex-direction:column;gap:5px;padding:8px}
.nav-burger span{width:22px;height:2px;background:var(--ink);border-radius:2px;transition:.3s}
.page-hero{background:linear-gradient(178deg,var(--icy) 0%,var(--icy-soft) 62%,var(--offwhite) 100%);padding:clamp(48px,7vw,88px) 0 clamp(36px,5vw,64px)}
.page-hero .display{margin:16px 0 18px;max-width:14em}
.photo-slot{border:2px dashed rgba(26,31,30,.28);background:repeating-linear-gradient(-45deg,var(--oat),var(--oat) 14px,#F5F1E8 14px,#F5F1E8 28px);border-radius:var(--radius);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;text-align:center;color:var(--ink-soft);padding:24px;min-height:220px}
.photo-slot svg{opacity:.5}
.photo-slot b{font-size:.8rem;letter-spacing:.1em;text-transform:uppercase;color:var(--ink)}
.photo-slot span{font-size:.82rem;max-width:26em}
.photo-slot i{font-style:normal;font-size:.68rem;letter-spacing:.08em;text-transform:uppercase;background:#fff;border-radius:999px;padding:4px 12px;margin-top:4px}
.todo-note{background:#FFF6DC;border:1px dashed rgba(26,31,30,.3);border-radius:14px;padding:14px 18px;font-size:.85rem;color:var(--ink-soft);margin:18px 0}
.todo-note b{color:var(--ink);font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;display:block;margin-bottom:4px}
.section{padding:clamp(56px,8vw,104px) 0}
.section.tint{background:var(--oat)}
.section.icy-tint{background:var(--icy-soft)}
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,4vw,56px);align-items:center}
.card{background:#fff;border-radius:var(--radius);padding:30px 28px;box-shadow:var(--shadow-soft)}
.card.oat{background:var(--offwhite)}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0}
.chips li{background:var(--oat);border-radius:999px;font-size:.8rem;font-weight:500;padding:6px 13px}
table.nd{width:100%;border-collapse:collapse;font-size:.92rem;background:#fff;border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow-soft)}
table.nd th,table.nd td{padding:14px 18px;text-align:left;border-bottom:1px solid rgba(26,31,30,.07)}
table.nd thead th{background:var(--icy);font-weight:600;font-size:.86rem}
table.nd tr:last-child td{border-bottom:none}
table.nd td.good{font-weight:600}
table.nd td.bad{color:var(--ink-soft)}
.badge{display:inline-block;background:#fff;border-radius:999px;font-size:.72rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;padding:7px 14px;box-shadow:0 4px 12px rgba(26,31,30,.1)}
.badge.soon{background:var(--oat)}
.faq-list{max-width:760px}
.faq-item{border-bottom:1px solid rgba(26,31,30,.1)}
.faq-item summary{list-style:none;display:flex;justify-content:space-between;align-items:center;gap:20px;padding:22px 4px;font-weight:600;font-size:1.02rem;cursor:pointer}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary svg{flex:none;transition:transform .3s var(--ease)}
.faq-item[open] summary svg{transform:rotate(45deg)}
.faq-item .faq-a{padding:0 4px 24px;color:var(--ink-soft);font-size:.94rem;max-width:56em}
.faq-group{margin-bottom:clamp(28px,4vw,44px)}
.faq-group h3{font-size:.82rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-soft);margin-bottom:6px}
.final{background:var(--icy);border-radius:0 0 var(--radius-lg) var(--radius-lg);margin:0 0 clamp(48px,6vw,80px);padding:clamp(64px,9vw,110px) 24px;text-align:center;position:relative;overflow:hidden}
.final .wrap{position:relative;z-index:1}
.final h2{margin-bottom:14px}
.final .lede{margin:0 auto 34px}
.final-start{margin:16px 0 0;font-size:.9rem;font-weight:500;color:var(--ink)}
@keyframes float{0%,100%{transform:translateY(0) rotate(-3deg)}50%{transform:translateY(-14px) rotate(4deg)}}
.final-chip{position:absolute;opacity:.9;filter:drop-shadow(0 10px 16px rgba(26,31,30,.12));animation:float 7s ease-in-out infinite}
.final-chip.f1{width:88px;left:6%;top:18%;animation-delay:-2s}
.final-chip.f2{width:72px;right:8%;bottom:16%;animation-delay:-4s}
.final-chip.f3{width:60px;right:16%;top:12%;animation-delay:-1s}
.final-chip.f4{width:66px;left:12%;bottom:12%;animation-delay:-5s}
@media (prefers-reduced-motion:reduce){.final-chip{animation:none}}
.final h2{margin-bottom:14px}
.final .lede{margin:0 auto 32px}
.final-support{margin:24px auto 0;max-width:52ch;font-size:.86rem;line-height:1.6;color:var(--ink-soft)}
.final-support a{font-weight:600;border-bottom:2px solid var(--yellow);padding-bottom:1px}
/* Appended under the block checkout (see ND_Checkout). One card holding the
   only decisions left on this page, then three one-line facts. */
.nd-first{max-width:680px;padding:22px 24px;border-radius:18px;background:var(--oat)}
/* It sits above the form: no gap to the heading, room before the fields. */
.nd-first{margin:0 0 32px}
.nd-first-lead{margin:0;font-size:1rem;line-height:1.55}
/* The one switch on the page: start on a week, or the full plan. */
.nd-first-switch{display:flex;gap:10px;align-items:flex-start;margin:0 0 14px;padding:0;cursor:pointer}
.nd-first-switch input{margin:3px 0 0;width:16px;height:16px;flex:none;accent-color:#1A1F1E;cursor:pointer}
.nd-first-switch b{font-size:.92rem;font-weight:600}
.nd-first-switch small{font-size:.84rem;line-height:1.5;color:var(--ink-soft)}
.nd-first-rows+.nd-first-switch{margin:14px 0 0;padding-top:12px;border-top:1px solid rgba(26,31,30,.08)}
.nd-first--in{max-width:none;margin:0 0 24px}
.wc-block-components-main .nd-checkout-facts{margin:28px 0 0;max-width:none}
/* The two shipments, named with their amounts and the charge date. */
.nd-first-rows{margin:0;display:grid;gap:10px}
.nd-first-rows>div{display:grid;grid-template-columns:8.5rem 1fr;gap:12px;align-items:baseline;padding:10px 0;border-top:1px solid rgba(26,31,30,.08)}
.nd-first-rows dt{margin:0;font-size:.7rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-soft)}
.nd-first-rows dd{margin:0}
.nd-first-rows dd b{display:block;font-size:.98rem;margin-bottom:2px}
.nd-first-rows dd span{display:block;font-size:.84rem;line-height:1.5;color:var(--ink-soft)}
/* Food, money and date each on their own line and always in that order, so
   the two shipments can be read down the page instead of parsed sentence by
   sentence. The money is the line people look for, so it is the one in ink. */
.nd-first-rows .nd-first-bags{font-weight:600;color:var(--ink)}
.nd-first-rows .nd-first-price{font-weight:600;color:var(--ink)}
.nd-first-rows .nd-first-when:empty{display:none}
@media (max-width:560px){.nd-first-rows>div{grid-template-columns:1fr;gap:2px}}
.nd-checkout-start{margin:22px 0 0;display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.nd-checkout-start label{font-size:.66rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-soft)}
.nd-checkout-start select{border:0;background:#fff;border-radius:12px;padding:10px 14px;font:inherit;font-weight:600;font-size:.9rem;box-shadow:0 10px 30px -14px rgba(26,31,30,.12);cursor:pointer}
.nd-checkout-start small{flex-basis:100%;font-size:.78rem;color:var(--ink-soft)}
/* Same 32px gap the card itself sits on, so the facts read as their own block
   rather than as a tail hanging off the card. Scoped to .nd-main to outweigh
   the `.nd-main ul` reset further down, which would otherwise flatten it. */
.nd-main .nd-checkout-facts{max-width:680px;margin:32px 0 0;padding:0;list-style:none;display:grid;gap:8px}
/* Same scoping reason as above: `.nd-main ul li` sets list-style:disc, which
   would put a browser marker beside our own dot. */
.nd-main .nd-checkout-facts li{list-style:none;position:relative;margin:0;padding-left:18px;font-size:.86rem;line-height:1.55;color:var(--ink-soft)}
.nd-checkout-facts li::before{content:'';position:absolute;left:0;top:.55em;width:6px;height:6px;border-radius:50%;background:var(--yellow-deep,#E8C64F)}
.nd-checkout-facts a{font-weight:600;color:var(--ink);border-bottom:2px solid var(--yellow);padding-bottom:1px}
footer{background:var(--offwhite);padding:0 0 44px}
.foot-grid{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:40px;padding-top:8px}
.foot-logo img{height:64px;width:auto;margin-bottom:18px}
.foot-grid p{font-size:.88rem;color:var(--ink-soft);max-width:26em}
.foot-col h4{font-size:.78rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-soft);margin-bottom:16px}
.foot-col ul{display:flex;flex-direction:column;gap:10px;font-size:.92rem;font-weight:500}
.foot-col a{opacity:.8;transition:opacity .2s}
.foot-col a:hover{opacity:1}
.foot-bottom{margin-top:44px;padding-top:22px;border-top:1px solid rgba(26,31,30,.08);display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;font-size:.8rem;color:var(--ink-soft)}
.reveal{opacity:0;transform:translateY(26px);transition:opacity .8s var(--ease),transform .8s var(--ease)}
.reveal.in{opacity:1;transform:none}
.reveal.d1{transition-delay:.08s}.reveal.d2{transition-delay:.16s}
body.no-motion .reveal{opacity:1;transform:none;transition:none}
@media (max-width:1020px){
  .grid-2{grid-template-columns:1fr}
  .foot-grid{grid-template-columns:1fr 1fr}
}
@media (max-width:720px){
  .nav-links{display:none;position:absolute;top:100%;left:0;right:0;background:var(--offwhite);flex-direction:column;gap:0;padding:10px 24px 20px;border-bottom:1px solid rgba(26,31,30,.08);box-shadow:0 20px 30px -20px rgba(26,31,30,.15)}
  .nav-links a{padding:12px 0}
  header.open .nav-links{display:flex}
  header.open .nav-burger span:nth-child(1){transform:translateY(7px) rotate(45deg)}
  header.open .nav-burger span:nth-child(2){opacity:0}
  header.open .nav-burger span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
  .nav-burger{display:flex}
  /* Room for the logo: the login is its icon alone, the gaps close up. */
  .nav{padding:12px 16px;gap:14px}
  .nav-right{gap:10px}
  .nav-login span{display:none}
  .nav-login svg{width:22px;height:22px}
  .nav-login{padding:4px}
  .nav .btn-primary{display:none}
  .foot-grid{grid-template-columns:1fr}
  table.nd{font-size:.82rem}
  table.nd th,table.nd td{padding:10px 10px}
}

/* Prose pages (Skilmálar, Persónuvernd and any editorial page). The shared
   reset removes list markers for nav, so put them back inside content. */
.nd-main{max-width:760px}
.nd-main h1{font-family:var(--display);font-size:clamp(2.2rem,5vw,3.2rem);line-height:1.05;margin:0 0 18px}
.nd-main h2{font-size:1.25rem;margin:38px 0 10px;line-height:1.3}
.nd-main p{margin:0 0 14px;line-height:1.7}
.nd-main .lede{font-size:1.08rem;color:var(--ink-soft);margin-bottom:26px}
.nd-main ul{margin:0 0 18px;padding-left:22px}
.nd-main ul li{list-style:disc;margin-bottom:8px;line-height:1.65}
.nd-main a{color:inherit;text-decoration:underline;text-underline-offset:3px}
.nd-main strong{font-weight:600}
.nd-main .nd-meta{margin-top:36px;padding-top:16px;border-top:1px solid var(--oat-deep);font-size:.85rem;color:var(--ink-soft)}

/* ---------- nutrition bubbles (ND_Recipes::bubbles_html) ---------- */
/* Shared by the homepage and Réttirnir so the two cannot drift apart. */
.nutri{display:flex;gap:10px;flex-wrap:wrap;margin:0 0 14px}
.nutri-item{background:#fff;border-radius:14px;padding:10px 14px;box-shadow:var(--shadow-soft);text-align:center;min-width:92px}
.nutri-item b{display:block;font-family:var(--display);font-size:1.35rem;line-height:1}
.nutri-item span{font-size:.68rem;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-soft)}
/* Ingredients as plain running text, not chips or a table. */
.rettir-label{font-size:.82rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-soft);margin:0 0 6px}
.ingredients{margin:0;font-size:.92rem;line-height:1.6}
.ingredients-rest{margin:6px 0 0;font-size:.8rem;color:var(--ink-soft)}

/* ---------- recipe photograph on Réttirnir ---------- */
.rettir-photo{display:block;width:100%;max-width:520px;height:auto;border-radius:18px;margin:0 0 22px}
/* The drawn pack, in the recipe's own tint, until a photograph exists. */
.rettir-pack{width:100%;max-width:520px;aspect-ratio:1/0.86;border-radius:18px;margin:0 0 22px;display:flex;align-items:flex-end;justify-content:center;overflow:hidden;background:linear-gradient(180deg,var(--icy),#f2feff)}
.rettir-pack[data-flavor="turkey"]{background:linear-gradient(180deg,var(--yellow),#fff8e6)}
.rettir-pack[data-flavor="fish"]{background:linear-gradient(180deg,var(--pink),#fff3f6)}
.rettir-pack svg{width:56%;transform:translateY(6%);filter:drop-shadow(0 22px 26px rgba(26,31,30,.18))}

/* ---------- card brands in the footer ---------- */
.foot-pay{display:flex;align-items:center;gap:8px;margin-top:10px}
.pay-mark{display:inline-flex;align-items:center;justify-content:center;width:48px;height:32px;background:#fff;border-radius:5px;box-shadow:0 1px 3px rgba(26,31,30,.18)}
/* Scoped under .nd-pay-marks so these beat WooCommerce's own
   ".woocommerce img{height:auto;max-width:100%}", which is more specific than
   a bare class and was stretching the Mastercard mark to fill its box. */
.nd-pay-marks img{display:block}
.nd-pay-marks .pay-visa{width:32px;height:auto}
.nd-pay-marks .pay-mc{height:20px;width:auto}

/* ---------- lagatafla í persónuverndarstefnu ---------- */
.nd-legal-table{width:100%;border-collapse:collapse;margin:16px 0;font-size:.9rem}
.nd-legal-table th,.nd-legal-table td{text-align:left;vertical-align:top;padding:10px 12px;border-bottom:1px solid rgba(26,31,30,.12)}
.nd-legal-table th{font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-soft);font-weight:600}
.nd-legal-table td{line-height:1.5}
@media(max-width:640px){
  .nd-legal-table,.nd-legal-table tbody,.nd-legal-table tr,.nd-legal-table td{display:block;width:100%}
  .nd-legal-table thead{display:none}
  .nd-legal-table tr{padding:12px 0;border-bottom:1px solid rgba(26,31,30,.12)}
  .nd-legal-table td{border:0;padding:2px 0}
  .nd-legal-table td:first-child{font-weight:600}
  .nd-legal-table td:last-child{color:var(--ink-soft);font-size:.84rem}
}

.nd-pay-marks{display:inline-flex;align-items:center;gap:8px;vertical-align:middle}
.nd-checkout-paywrap{display:flex;align-items:center;flex-wrap:wrap;gap:10px;margin:14px 0 0;font-size:.84rem;color:var(--ink-soft)}

/* ---------- ingredient dialog ---------- */
.nd-ing-open{display:inline-flex;align-items:center;gap:7px;border:0;background:none;padding:8px 0;font:inherit;font-size:.86rem;font-weight:600;color:var(--ink);cursor:pointer;text-decoration:underline;text-underline-offset:3px}
.nd-ing-open:hover{opacity:.7}
.nd-ing-open svg{transition:transform .2s var(--ease)}
.nd-ing-open:hover svg{transform:translateX(3px)}
/* display:flex on a class beats the browser's own [hidden]{display:none}, so
   without this every dialog on the page renders open at once and the close
   button appears to do nothing. Same trap as the cookie banner. */
.nd-ing[hidden]{display:none!important}
.nd-ing{position:fixed;inset:0;z-index:9998;background:rgba(26,31,30,.55);display:flex;align-items:center;justify-content:center;padding:20px;overflow-y:auto}
.nd-ing-box{position:relative;background:var(--offwhite);border-radius:var(--radius-lg);max-width:520px;width:100%;padding:0 0 28px;box-shadow:0 40px 80px -30px rgba(26,31,30,.6);outline:none;max-height:calc(100vh - 40px);overflow-y:auto}
.nd-ing-art{border-radius:var(--radius-lg) var(--radius-lg) 0 0;overflow:hidden;background:var(--oat)}
.nd-ing-art img{width:100%;height:auto;display:block}
.nd-ing-box h3{font-family:var(--display);font-weight:700;font-size:1.9rem;line-height:1.05;margin:24px 28px 0}
.nd-ing-box h4{margin:18px 28px 6px;font-size:.72rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-soft)}
.nd-ing-box .ingredients{margin:0 28px;font-size:.94rem;line-height:1.65}
.nd-ing-x{position:absolute;top:14px;right:14px;width:38px;height:38px;border:0;border-radius:50%;background:rgba(250,249,246,.92);color:var(--ink);display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 2px 10px rgba(26,31,30,.18)}
.nd-ing-x:hover{background:#fff}
.nd-ing-x:focus-visible,.nd-ing-open:focus-visible{outline:3px solid #74c7d3;outline-offset:2px}
.recipe-more{margin-top:clamp(26px,3vw,40px);display:flex;justify-content:center}
@media (max-width:520px){.nd-ing-box h3{font-size:1.5rem;margin:20px 20px 0}.nd-ing-box h4,.nd-ing-box .ingredients{margin-left:20px;margin-right:20px}}

/* The dialog is a nutrition declaration: values, ingredients, additives. The
   value grid is fixed at three columns so six figures read as two tidy rows
   inside a narrow box, whichever page opened it. */
.nd-ing-nutri{margin:0 28px 4px}
.nd-ing-nutri .nutri{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:0}
.nd-ing-nutri .nutri-item{background:#fff;border-radius:12px;padding:9px 6px;text-align:center;min-width:0;box-shadow:none;border:1px solid rgba(26,31,30,.08);flex:none}
.nd-ing-nutri .nutri-item b{display:block;font-family:var(--display);font-size:1.05rem;line-height:1.1}
.nd-ing-nutri .nutri-item span{display:block;font-size:.56rem;letter-spacing:.04em;text-transform:uppercase;color:var(--ink-soft);line-height:1.25}
.nd-ing-add{font-size:.82rem;color:var(--ink-soft)}
/* The short list under a picture: what is in the food, no percentages. */
.nd-short{margin:0 0 12px;font-size:.9rem;line-height:1.6;color:var(--ink-soft)}
@media (max-width:520px){.nd-ing-nutri{margin-left:20px;margin-right:20px}}
/* A list inside an answer: the delivery cadence is three facts, not a sentence. */
.faq-ul{margin:0 0 10px;padding-left:20px;list-style:disc}
.faq-ul li{margin:2px 0;list-style:disc}

/* Social icons in the footer. Sized to the card marks beside them so the two
   rows read as one block, and drawn in the footer's own ink rather than each
   network's brand colour: three brand colours in a footer corner is three
   logos competing with ours. */
.foot-social{display:flex;align-items:center;gap:14px;margin-top:12px}
.foot-social-link{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;color:inherit;opacity:.75;transition:opacity .2s var(--ease),transform .2s var(--ease)}
.foot-social-link svg{width:100%;height:100%;display:block}
.foot-social-link:hover{opacity:1;transform:translateY(-2px)}
.foot-social-link:focus-visible{outline:3px solid #74c7d3;outline-offset:3px;border-radius:4px;opacity:1}
@media (prefers-reduced-motion:reduce){.foot-social-link{transition:none}.foot-social-link:hover{transform:none}}

/* ---- the checkout's own chrome (header-checkout.php) --------------------
   Three cells: the way back, the logo, the word "secure". Nothing else on
   the page links away from the payment. */
.co-head{position:sticky;top:0;z-index:60;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:16px;padding:12px 24px;background:rgba(250,249,246,.9);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid rgba(26,31,30,.06)}
.co-back{display:inline-flex;align-items:center;gap:7px;font-size:.88rem;font-weight:600;opacity:.8;transition:opacity .2s;justify-self:start}
.co-back:hover{opacity:1}
.co-logo img{height:30px;width:auto;max-width:none}
.co-secure{display:inline-flex;align-items:center;gap:6px;font-size:.8rem;font-weight:600;color:var(--ink-soft);justify-self:end}
.co-main{max-width:var(--max);margin:0 auto;padding:2.5rem 1.5rem 4rem}
.co-main>h1,.co-main .wp-block-woocommerce-checkout>h1{display:none}
/* The summary follows the form down, so the amount and the pay button are on
   screen together at the moment that matters. */
@media (min-width:900px){.wc-block-checkout__sidebar{position:sticky;top:76px;align-self:flex-start}}
.co-foot{max-width:var(--max);margin:0 auto;padding:22px 24px 40px;display:flex;flex-wrap:wrap;gap:8px 22px;font-size:.8rem;color:var(--ink-soft);border-top:1px solid rgba(26,31,30,.08)}
.co-foot a{opacity:.85}.co-foot a:hover{opacity:1}
@media (max-width:560px){
  .co-head{padding:10px 16px;gap:10px}
  .co-back span,.co-secure span{display:none}
  .co-back svg{width:22px;height:22px}
  .co-logo img{height:26px}
  .co-main{padding:1.5rem 1rem 3rem}
}

/* ---------- delivery frequency chooser (checkout sidebar and Mínar síður) ---------- */
.nd-freq{background:#fff;border:1px solid rgba(26,31,30,.10);border-radius:18px;padding:18px 20px;margin:16px 0 0;font-family:inherit}
.nd-freq--account{margin:0;padding:0;border:0;background:transparent}
.nd-freq-head{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:8px}
.nd-freq-title{font-size:.7rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-soft,#5d635f)}
.nd-freq--account .nd-freq-title{display:none}
.nd-freq-toggle{border:0;background:none;padding:0;font:inherit;font-size:.86rem;font-weight:600;color:var(--ink,#1a1f1e);cursor:pointer;border-bottom:2px solid var(--yellow,#F5C400)}
.nd-freq--account .nd-freq-toggle{margin-left:auto}
.nd-freq-current{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:4px 0 2px}
.nd-freq-current b{font-size:.98rem;font-weight:600}
.nd-freq-tag{font-size:.8rem;font-weight:600;padding:3px 10px;border-radius:999px;white-space:nowrap}
.nd-freq-tag.is-included,.nd-freq-price.is-included{color:#1f6b3a}
.nd-freq-tag.is-included{background:#E4F5EA}
.nd-freq-tag.is-plus{background:#FFF1CC}.nd-freq-tag.is-minus{background:#E4F5EA}
.nd-freq-options{display:grid;gap:8px;margin:12px 0 0}
.nd-freq-options[hidden]{display:none}
.nd-freq-opt{display:flex;align-items:center;gap:12px;padding:12px 14px;border:1.5px solid rgba(26,31,30,.12);border-radius:14px;cursor:pointer;background:#fff;transition:border-color .15s,box-shadow .15s}
.nd-freq-opt:hover{border-color:rgba(26,31,30,.28)}
.nd-freq-opt.is-on{border-color:var(--ink,#1a1f1e);box-shadow:0 0 0 1px var(--ink,#1a1f1e)}
.nd-freq-opt input{width:16px;height:16px;margin:0;flex:none;accent-color:#1A1F1E}
.nd-freq-opt-body{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.nd-freq-opt-body b{font-size:.92rem;font-weight:600}
.nd-freq-opt-body small{font-size:.8rem;line-height:1.4;color:var(--ink-soft,#5d635f)}
.nd-freq-price{font-size:.9rem;font-weight:600;white-space:nowrap;font-variant-numeric:tabular-nums}
.nd-freq-price.is-plus{color:var(--ink,#1a1f1e)}.nd-freq-price.is-minus{color:#1f6b3a}
.nd-freq-note{margin:12px 0 0;font-size:.8rem;line-height:1.5;color:var(--ink-soft,#5d635f)}
.nd-freq.is-busy{opacity:.6;pointer-events:none}
.wc-block-checkout__sidebar .nd-freq{margin-top:16px}

.nd-freq-title{margin:0 0 10px;font-size:1rem;font-weight:600;text-transform:none;letter-spacing:0;color:var(--ink,#1a1f1e)}
.nd-freq-opt-body b .nd-freq-tag{font-size:.68rem;padding:2px 8px;margin-left:6px;vertical-align:middle}
.nd-freq-price.is-selected{color:var(--ink-soft,#5d635f);font-weight:500}
.nd-first-rows[hidden]{display:none}
.nd-first-switch small{display:block;margin-top:2px}
.nd-start{background:#fff;border:1px solid rgba(26,31,30,.10);border-radius:14px;padding:12px 16px;margin:12px 0 0;display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.nd-start label{font-size:.8rem;font-weight:600;color:var(--ink-soft,#5d635f)}
.nd-start select{flex:1;min-width:180px;border:1px solid rgba(26,31,30,.12);background:#fff;border-radius:10px;padding:8px 12px;font:inherit;font-size:.86rem;cursor:pointer}
.nd-start small{flex-basis:100%;font-size:.76rem;color:var(--ink-soft,#5d635f)}
.nd-start small:empty{display:none}

.nd-freq-note{margin:18px 0 0;font-size:.74rem;color:var(--ink-soft,#5d635f)}

/* ---------- the 7-day offer card ---------- */
.nd-first.nd-offer{background:#FFF6DA;border:1.5px solid #F1DE9C;border-radius:18px;padding:0;overflow:hidden;transition:border-color .15s,box-shadow .15s}
.nd-first.nd-offer.is-trial{border-color:var(--ink,#1a1f1e);box-shadow:0 0 0 1px var(--ink,#1a1f1e)}
.nd-offer-body{display:block;padding:20px 24px 18px;cursor:pointer}
.nd-offer-badge{display:inline-block;font-size:.66rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:#7a5a00;background:#FFE7A3;border-radius:999px;padding:4px 10px;margin-bottom:10px}
.nd-offer-h{display:block;font-size:1.25rem;font-weight:700;line-height:1.2;margin:0 0 6px}
.nd-offer-p{display:block;font-size:.92rem;line-height:1.5;color:var(--ink-soft,#5d635f);max-width:560px}
.nd-offer-check{display:flex;align-items:center;gap:10px;margin-top:14px;font-weight:600;font-size:.95rem}
.nd-offer-check input{width:18px;height:18px;margin:0;flex:none;accent-color:#1A1F1E;cursor:pointer}
.nd-offer .nd-first-rows{margin:0;padding:6px 24px 18px;border-top:1px solid rgba(26,31,30,.08);background:rgba(255,255,255,.55)}

.nd-offer-p2{margin-top:6px;font-weight:600;color:var(--ink,#1a1f1e)}
.nd-offer .nd-first-rows{gap:4px;padding:2px 24px 14px}
.nd-offer .nd-first-rows>div{padding:8px 0}
.nd-offer .nd-first-rows dd b{font-size:.92rem}
.nd-offer .nd-first-rows dd span{font-size:.8rem;line-height:1.45}
.nd-nobind{margin:4px 0 0;padding:0;font-size:.8rem;font-weight:600;color:var(--ink,#1a1f1e)}

/* ---------- consistency pass: one border weight, one radius family, one type hierarchy ---------- */
.nd-freq{border:1px solid rgba(26,31,30,.10);border-radius:16px;padding:18px 20px}
.nd-freq-title{font-weight:600}
.nd-freq-opt{border:1px solid rgba(26,31,30,.12);border-radius:12px;padding:12px 14px;box-shadow:none}
.nd-freq-opt:hover{border-color:rgba(26,31,30,.30)}
.nd-freq-opt.is-on{border-color:var(--ink,#1a1f1e);box-shadow:inset 0 0 0 .5px var(--ink,#1a1f1e)}
.nd-freq-opt-body b{font-weight:500;font-size:.92rem}
.nd-freq-opt-body small{font-weight:400}
.nd-freq-value{display:block;font-style:normal;font-size:.8rem;font-weight:500;color:var(--ink,#1a1f1e);margin-top:2px}
.nd-freq-price{font-weight:500}
.nd-freq-price.is-selected{font-weight:400}
.nd-freq-price:empty{display:none}
.nd-freq-note{font-weight:400}

.nd-first.nd-offer{background:#FFF9E6;border:1px solid #F0E2B4;border-radius:16px;box-shadow:none}
.nd-first.nd-offer.is-trial{border-color:#E3CC7C;box-shadow:none}
.nd-offer-badge{font-weight:600;background:#FBEBB0;color:#6f5300}
.nd-offer-h{font-size:1.15rem;font-weight:700}
.nd-offer-p{font-weight:400}
.nd-offer-check{font-weight:500;font-size:.92rem}
.nd-offer .nd-first-rows{background:transparent;border-top:1px solid rgba(26,31,30,.08);padding:10px 24px 4px;gap:2px}
.nd-offer .nd-first-rows>div{border-top:0;padding:6px 0}
.nd-offer .nd-first-rows dt{font-weight:500}
.nd-offer .nd-first-rows dd b{font-weight:500;font-size:.9rem}
.nd-offer .nd-first-rows dd span{font-weight:400}
.nd-offer .nd-first-rows .nd-first-bags,.nd-offer .nd-first-rows .nd-first-price{font-weight:400;color:var(--ink-soft,#5d635f)}
.nd-offer-fine{margin:0;padding:6px 24px 16px;font-size:.76rem;line-height:1.5;color:var(--ink-soft,#5d635f)}
.nd-offer-fine[hidden]{display:none}
.nd-start{border:1px solid rgba(26,31,30,.10);border-radius:12px}
.nd-start select{border:1px solid rgba(26,31,30,.12);border-radius:10px}
.nd-nobind{font-weight:500}
/* An empty WooCommerce slot wrapper at the foot of the summary still drew its top border: a stray line above our boxes. */
.wc-block-checkout__sidebar .wc-block-components-totals-wrapper.slot-wrapper:empty{display:none;border:0}

/* ---------- the included frequency, framed ---------- */
.nd-freq-included{background:#FFF9E6;border-radius:14px;padding:8px 8px 6px}
.nd-freq-included .nd-freq-opt{background:#fff}
.nd-freq-included-label{display:block;text-align:center;font-size:.66rem;font-weight:500;letter-spacing:.12em;text-transform:uppercase;color:#6f5300;padding:7px 0 3px}
.nd-freq-value{display:none}

.nd-offer-badge{display:none}
.nd-offer-h{font-size:1.3rem}
.nd-offer .nd-first-rows{border-top:0;padding-top:0}
.nd-offer-fine{padding-top:8px}

/* ---------- offer card: presence of the first version, weights of the second ---------- */
.nd-first.nd-offer{background:#FFF6DA;border:1.5px solid #F1DE9C;border-radius:18px}
.nd-first.nd-offer.is-trial{border-color:var(--ink,#1a1f1e);box-shadow:0 0 0 1px var(--ink,#1a1f1e)}
.nd-offer-body{padding:22px 26px 18px}
.nd-offer-h{font-size:1.35rem;font-weight:700;margin-bottom:8px}
.nd-offer-p{font-size:.95rem;font-weight:400;color:var(--ink-soft,#5d635f)}
.nd-offer-check{font-weight:600;font-size:.98rem;margin-top:16px}
.nd-offer .nd-first-rows{border-top:0;background:transparent;padding:4px 26px 6px;gap:6px}
.nd-offer .nd-first-rows>div{border-top:0;padding:10px 0}
.nd-offer .nd-first-rows dt{font-size:.7rem;font-weight:600;letter-spacing:.12em}
.nd-offer .nd-first-rows dd b{font-size:1rem;font-weight:700;margin-bottom:3px}
.nd-offer .nd-first-rows dd span{font-size:.88rem;line-height:1.5}
.nd-offer .nd-first-rows .nd-first-bags,.nd-offer .nd-first-rows .nd-first-price{font-weight:400;color:var(--ink,#1a1f1e)}
.nd-offer .nd-first-rows .nd-first-when{color:var(--ink-soft,#5d635f)}
.nd-offer-fine{padding:4px 26px 18px;font-size:.8rem}

/* ---------- order received ---------- */
.nd-received{max-width:640px;margin:0 auto}
.nd-received-eyebrow{font-size:.7rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-soft);margin:0 0 10px}
.nd-received-h{font-size:2.2rem;margin:0 0 8px}
.nd-received-lead{font-size:1.05rem;color:var(--ink-soft);margin:0 0 22px}
.nd-received-card{background:#fff;border:1px solid rgba(26,31,30,.10);border-radius:18px;padding:8px 22px 16px;margin:0 0 20px}
.nd-received-row{display:flex;justify-content:space-between;gap:16px;padding:12px 0;border-bottom:1px solid rgba(26,31,30,.07);font-size:.95rem}
.nd-received-row span{color:var(--ink-soft)}.nd-received-row b{font-weight:600;text-align:right}
.nd-received-note{margin:12px 0 0;font-size:.84rem;color:var(--ink-soft)}
.nd-received-next{list-style:none;margin:0 0 22px;padding:0;display:grid;gap:8px}
.nd-received-next li{position:relative;padding-left:18px;font-size:.92rem;line-height:1.5;color:var(--ink-soft)}
.nd-received-next li::before{content:'';position:absolute;left:0;top:.55em;width:6px;height:6px;border-radius:50%;background:var(--yellow-deep,#E8C64F)}
.nd-received-actions{margin:0 0 26px}
.nd-received-details summary{cursor:pointer;font-weight:600;font-size:.9rem;color:var(--ink-soft);margin-bottom:12px}
.nd-received-details .woocommerce-order{font-size:.9rem}
.nd-received-details .woocommerce-order>p,.nd-received-details .wc-block-order-confirmation-status{display:none}
.nd-received-actions a{display:inline-block;background:var(--yellow,#F5C400);color:var(--ink,#1a1f1e);text-decoration:none;font-weight:600;padding:12px 22px;border-radius:999px}
.nd-received-actions a:hover{filter:brightness(.97)}
.nd-received-card{padding:20px 22px}
.nd-received-dog{margin:0 0 12px;font-size:.9rem;color:var(--ink-soft)}
.nd-received-label{margin:0 0 2px;font-size:.7rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-soft)}
.nd-received-primary{margin:0 0 6px;font-size:1.15rem;font-weight:600}
.nd-received-secondary{margin:0 0 4px;font-size:.88rem;color:var(--ink-soft)}
.nd-received-hint{margin:-14px 0 26px;font-size:.84rem;color:var(--ink-soft)}
.nd-received-addr{color:var(--ink);margin-top:10px}
.nd-received-h2{font-size:1rem;margin:0 0 8px}
.nd-received-next{list-style:decimal;padding-left:20px}
.nd-received-next li{padding-left:2px}.nd-received-next li::before{display:none}
.nd-received-facts{border-collapse:collapse;font-size:.9rem;margin:0 0 20px}
.nd-received-facts td{padding:4px 18px 4px 0;vertical-align:top}
.nd-received-facts td:first-child{color:var(--ink-soft);white-space:nowrap}

/* Pages with an English body: the toggle flips <html lang>, this picks the copy. */
.nd-lang-en{display:none}
html[lang="en"] .nd-lang-en{display:block}
html[lang="en"] .nd-lang-is{display:none}