/* Luiza Schulz Design — responsive styles */
:root{
  --ink:#341419;
  --ink-2:#5a3a3f;
  --muted:#8c6e66;
  --accent:#811837;
  --accent-2:#a8384e;
  --ticker:#792040;
  --cream:#fcf2e5;
  --pink:#f5d2d8;
  --pink-line:#efb6c3;
  --pink-soft:#f4e5e8;
  --card-line:#f6d9df;
  --alt:#fdf8f6;
  --white:#fff;
  --dark:#341419;
  --wrap:1184px;
  --gut:clamp(20px,5vw,40px);
  --radius:20px;
  --nav-h:76px;
  color-scheme:light;
}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:calc(var(--nav-h) + 12px)}
body{font-family:Outfit,system-ui,-apple-system,sans-serif;color:var(--ink);background:#fff;line-height:1.6;overflow-x:hidden;-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%;height:auto}
a{color:inherit}
button{font:inherit}
.wrap{width:100%;max-width:calc(var(--wrap) + 2 * var(--gut));margin:0 auto;padding:0 var(--gut)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ---------- nav ---------- */
.nav{position:sticky;top:0;z-index:30;background:rgba(255,255,255,.92);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid #eadcdc}
.nav .wrap{display:flex;align-items:center;justify-content:space-between;height:var(--nav-h);max-width:calc(1240px + 2 * var(--gut))}
.logo img{width:clamp(118px,13vw,170px);height:auto}
.nav ul{display:flex;gap:clamp(18px,2.6vw,32px);list-style:none}
.nav ul a{font-weight:600;font-size:clamp(15px,1.2vw,17px);text-decoration:none;color:var(--ink);padding:8px 0;text-underline-offset:6px}
.nav ul a:hover{color:var(--accent)}
.nav ul a[aria-current]{color:var(--accent);text-decoration:underline;text-decoration-thickness:1.5px}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;font-weight:600;font-size:16px;line-height:1.2;padding:14px 26px;border-radius:999px;border:1.5px solid var(--accent);color:var(--accent);background:none;text-decoration:none;cursor:pointer;transition:background .2s,color .2s}
.btn:hover{background:var(--accent);color:#fff}
.btn.sm{font-size:15px;padding:11px 20px}
.btns{display:flex;flex-wrap:wrap;gap:12px 14px;margin-top:24px}
.more{display:inline-block;font-weight:600;color:var(--accent);text-decoration:none;margin-top:14px}
.more:hover{text-decoration:underline;text-underline-offset:4px}

/* ---------- home hero ---------- */
.hero{position:relative;overflow:hidden;text-align:center;background:radial-gradient(ellipse 70% 80% at 50% 45%,#fff 0,#fefaf7 55%,#fbf2ee 100%);padding:clamp(56px,10vw,110px) 0 clamp(56px,9vw,100px)}
.hero::before{content:"";position:absolute;inset:-20%;background:repeating-radial-gradient(ellipse at 50% 50%,transparent 0 38px,rgba(129,24,55,.035) 39px 40px);pointer-events:none}
.hero .shape{position:absolute;right:0;top:12px;width:clamp(44px,6.3vw,92px);aspect-ratio:90/255;background:#e397aa;clip-path:polygon(66% 3%,100% 0,100% 100%,33% 84%,0 42%)}
.hero .welcome{width:min(540px,82vw);margin:0 auto -4px;position:relative}
.hero h1{position:relative;font-size:clamp(40px,7.4vw,90px);line-height:1.08;font-weight:600;letter-spacing:-.015em}
.hero p{position:relative;font-size:clamp(18px,2vw,26px);line-height:1.45;max-width:690px;margin:16px auto 0;color:var(--ink)}
.hero .btn{position:relative;margin-top:36px;padding:14px 28px}

/* ---------- ticker ---------- */
.tick{background:var(--ticker);overflow:hidden;height:clamp(48px,4.7vw,67px);display:flex;align-items:center}
.track{display:flex;width:max-content;animation:mq 40s linear infinite}
.tick.slow .track{animation-duration:34s}
.run{display:flex;align-items:center;gap:28px;padding-right:28px}
.tick span{font-weight:600;font-size:clamp(14px,1.25vw,18px);letter-spacing:.14em;color:var(--cream);white-space:nowrap}
.tick i{font-style:normal;font-size:clamp(14px,1.25vw,18px);color:#f5b8c2}
.tick.foot i{color:var(--cream)}
@keyframes mq{to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.track{animation:none}html{scroll-behavior:auto}}

/* ---------- home work ---------- */
.work{background:#fbfaf8;padding:clamp(56px,8vw,100px) 0 clamp(64px,9vw,120px)}
.work h2{font-size:clamp(36px,4.4vw,56px);line-height:1.1;font-weight:600}
.work .lead{color:#6f5a56;font-size:clamp(16px,1.4vw,20px);margin-top:10px}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:48px 25px;margin-top:48px}
.card{text-decoration:none;color:inherit;display:block}
.card .ph{position:relative;border-radius:var(--radius);overflow:hidden;aspect-ratio:378/160;background:#ddd}
.card .ph img{width:100%;height:100%;object-fit:cover;filter:grayscale(1);transition:filter .4s ease,transform .5s ease}
.card:hover .ph img,.card:focus-visible .ph img{filter:none;transform:scale(1.03)}
@media (hover:none){.card .ph img{filter:none}}
.card h3{font-size:clamp(20px,1.7vw,24px);font-weight:600;margin-top:16px;line-height:1.3}
.card p{color:#6f5a56;font-size:15px;line-height:1.5;margin-top:8px}
.card .more{margin-top:10px}

.aboutbox{display:grid;grid-template-columns:354px 1fr;gap:20px;background:var(--pink-soft);border-radius:var(--radius);padding:clamp(32px,4.5vw,64px) clamp(24px,3.4vw,49px);margin-top:clamp(64px,7vw,100px)}
.aboutbox h2{font-size:clamp(28px,2.4vw,34px)}
.aboutbox p{font-size:clamp(16px,1.25vw,18px);line-height:1.95}
.aboutbox .btn{margin-top:22px}

/* ---------- footer ---------- */
.foot-wrap{background:var(--dark);color:#fdf3ee}
.footer{display:grid;grid-template-columns:1fr auto;align-items:center;gap:40px;padding:clamp(56px,9vw,130px) 0 clamp(48px,6vw,70px)}
.footer .k{color:#f2a7b8;font-size:16px}
.footer h2{font-weight:400;font-size:clamp(34px,3.4vw,48px);line-height:1.15;margin-top:12px}
.footer .btns{margin-top:36px;gap:16px}
.footer .btn{min-width:250px;padding:18px 26px;border-color:#fcf2ee;color:#fcf2ee}
.footer .btn.solid{background:#faf0ec;color:var(--ink)}
.footer .btn:hover{background:#fff;color:var(--ink)}
.footer .arch{width:clamp(220px,22vw,314px)}
.copy{border-top:1px solid #5d3a40;padding:20px 0 34px;font-size:15px;color:#e9d8d4}

/* ---------- project hero ---------- */
.phero{position:relative;overflow:hidden;background:#fff;padding:28px 0 clamp(48px,6vw,80px)}
.phero::before{content:"";position:absolute;inset:0;background:linear-gradient(64deg,transparent 3%,#fdf5f4 3% 14%,transparent 14% 69%,#fdf5f4 69% 77%,transparent 77% 81%,#fdf5f4 81% 89%,transparent 89%);pointer-events:none}
.phero>.wrap{position:relative}
.back{display:inline-flex;align-items:center;gap:6px;font-weight:600;font-size:15px;color:var(--accent);text-decoration:none;padding:6px 0}
.back:hover{text-decoration:underline;text-underline-offset:4px}
.phero h1{font-size:clamp(42px,7vw,100px);line-height:1.12;font-weight:600;letter-spacing:-.015em;margin-top:clamp(18px,3vw,32px)}
.phero .intro{font-size:clamp(17px,1.35vw,19px);line-height:1.85;max-width:850px;margin-top:clamp(18px,3vw,36px)}
.banner{display:block;width:100%;aspect-ratio:1440/800;object-fit:cover}

/* ---------- meta (role / overview) ---------- */
.meta{display:grid;grid-template-columns:355px 1fr;gap:28px 0;padding:clamp(56px,7vw,100px) 0 clamp(56px,7vw,100px)}
.meta .side{padding-left:clamp(0px,2.6vw,37px);display:grid;gap:26px;align-content:start}
.meta h3,.meta h4{font-size:16px;font-weight:600;color:var(--ink)}
.meta .side p{font-size:clamp(17px,1.4vw,20px);margin-top:4px}
.meta .main{display:grid;gap:36px;align-content:start;max-width:740px}
.meta .main p{font-size:clamp(16px,1.3vw,18px);line-height:1.95;margin-top:8px}
.meta.tight{padding-top:28px}

/* ---------- sections ---------- */
.sec{padding:clamp(56px,7vw,100px) 0}
.sec.alt{background:var(--alt)}
.sec+.sec:not(.alt):not(.band){padding-top:0}
.sec.alt+.sec{padding-top:clamp(56px,7vw,100px)}
.kick{display:block;font-weight:600;font-size:16px;color:var(--accent);margin-bottom:6px}
.sec h2{font-size:clamp(26px,2.4vw,34px);line-height:1.25;font-weight:600;color:#2e1216}
.sec h2.ac,.ac{color:var(--accent)}
.sec h2+p,.sec .txt{font-size:clamp(16px,1.3vw,18px);line-height:1.95;margin-top:14px;max-width:1184px}
.ph-title{font-size:clamp(28px,2.6vw,36px);font-weight:600;color:var(--accent)}
.proj-head{padding-top:clamp(40px,5vw,60px)}
.proj-head h2{font-size:clamp(26px,2.4vw,32px)}

.grid{display:grid;gap:16px;margin-top:clamp(28px,3.5vw,48px)}
.g2{grid-template-columns:repeat(2,1fr);gap:clamp(16px,3vw,44px)}
.g2.close{gap:16px}
.g3{grid-template-columns:repeat(3,1fr)}
.g4{grid-template-columns:repeat(4,1fr)}
.grid+.grid{margin-top:16px}
.fig{display:block;border-radius:var(--radius);overflow:hidden;border:1px solid var(--card-line);background:#fff}
.fig img{width:100%;height:auto}
.fig.fill{height:100%}
.fig.fill img{height:100%;object-fit:cover}
.fig.flat{border:0}
a.fig{cursor:zoom-in;transition:transform .25s,box-shadow .25s}
a.fig:hover{transform:translateY(-2px);box-shadow:0 10px 30px rgba(52,20,25,.12)}
.wide{margin-top:clamp(28px,3.5vw,48px)}

/* pink panel with label */
.pcard{background:var(--pink);border:1px solid var(--pink-line);border-radius:var(--radius);padding:20px 20px clamp(20px,3vw,48px)}
.pcard .lbl{display:inline-block;background:#fff;border-radius:3px;padding:12px 18px;font-weight:600;font-size:clamp(20px,1.85vw,26px);line-height:1.3;color:var(--accent);margin-bottom:clamp(20px,3.6vw,56px)}
.pcard .fig{border:0;border-radius:12px}
.pcard .row{display:grid;grid-template-columns:1fr 1fr;gap:20px}

/* design process strip */
.process{background:#fcf8f5;padding:clamp(56px,7vw,90px) 0}
.process h2{text-align:center;font-size:clamp(30px,3.4vw,48px);font-weight:600}
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;margin-top:clamp(28px,4vw,60px)}
.steps h3{display:flex;align-items:center;gap:8px;font-size:16px;font-weight:600}
.steps h3::before{content:"";width:12px;height:12px;border-radius:50%;background:var(--accent)}
.steps ul{list-style:none;margin-top:14px;padding-left:8px}
.steps li{font-size:clamp(16px,1.3vw,18px);line-height:1.95;padding-left:16px;position:relative}
.steps li::before{content:"•";position:absolute;left:0}

/* numbered items */
.items{display:grid;grid-template-columns:1fr 1fr;gap:clamp(56px,8vw,110px) clamp(24px,3vw,44px);align-items:start}
.item h3{font-size:clamp(22px,1.85vw,26px);font-weight:600;color:var(--accent);line-height:1.3;padding-left:6px}
.item h3 b{font-weight:600;margin-right:8px}
.item p{font-size:clamp(16px,1.3vw,18px);line-height:1.95;margin-top:14px}
.item .fig{margin-top:18px;border-color:#efc5cf}
.item .fig.bare{border:0;border-radius:0}

/* two-colour band */
.band{display:grid;grid-template-columns:1fr 1fr;color:#fdf3ee}
.band>div{padding:clamp(48px,7vw,100px) var(--gut) clamp(48px,7vw,100px)}
.band>div:first-child{background:var(--dark);padding-left:max(var(--gut),calc((100vw - var(--wrap)) / 2))}
.band>div:last-child{background:var(--accent);padding-left:clamp(24px,10vw,145px)}
.band h3{font-size:clamp(22px,1.85vw,26px);font-weight:600}
.band p{font-size:clamp(16px,1.3vw,18px);line-height:1.95;margin-top:14px;max-width:470px}

/* list pairs (skills developed / main features) */
.pairs{display:grid;grid-template-columns:1fr 1fr;gap:28px 60px;margin-top:22px}
.pairs dt{font-weight:600;font-size:18px}
.pairs dd{font-size:18px;line-height:1.3;margin-top:2px}

/* stat cards */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:clamp(28px,3.5vw,48px)}
.stat{background:var(--pink);border-radius:var(--radius);padding:24px 24px 40px}
.stat b{display:block;font-size:clamp(36px,3.4vw,48px);line-height:1.1;font-weight:600}
.stat span{display:block;font-size:18px;line-height:1.95;margin-top:6px}

/* 3-col text + image (graphic) */
.cols3{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:clamp(28px,3.5vw,44px)}
.cols3 h3{font-size:clamp(22px,1.85vw,26px);font-weight:600;color:var(--accent)}
.cols3 p{font-size:clamp(16px,1.3vw,18px);line-height:1.95;margin-top:12px;padding-right:12px}
.cols3 .fig{margin-top:22px}
.cols3>div{display:flex;flex-direction:column}
.cols3>div .fig{margin-top:auto}
.cols3 .spacer{flex:1;min-height:22px}

/* models (product) */
.models h4{font-size:17px;font-weight:600;color:var(--accent);margin-top:22px}
.models p{font-size:clamp(16px,1.3vw,18px);line-height:1.95;margin-top:8px}

/* project switcher */
.next{display:grid;grid-template-columns:1fr 1fr}
.nx{position:relative;display:flex;flex-direction:column;min-height:clamp(420px,42vw,600px);text-decoration:none;overflow:hidden}
.nx .tx{padding:clamp(40px,3.5vw,50px) var(--gut) 24px clamp(var(--gut),8.9vw,128px)}
.nx+.nx .tx{padding-left:clamp(var(--gut),10vw,145px)}
.nx .tag{display:inline-block;font-size:13.5px;padding:8px 16px;border-radius:999px;color:#fff}
.nx h3{font-size:clamp(22px,1.85vw,26px);font-weight:600;margin-top:10px}
.nx .sub{font-size:clamp(16px,1.3vw,18px);margin-top:6px}
.nx .go{display:inline-block;font-weight:600;font-size:18px;margin-top:16px}
.nx:hover .go{text-decoration:underline;text-underline-offset:5px}
.nx img{margin-top:auto;width:100%;height:auto}
.nx.dark{background:#341419;color:#fff}
.nx.light{background:#f3e5e2;color:var(--ink)}
.nx.red{background:#811837;color:#fff}
.nx.black{background:#222;color:#fff}
.tag.meo{background:#a8384e}.tag.lasa{background:#e8a054;color:var(--ink)}.tag.fash{background:#ac6a48}

/* bonus box */
.bonus{display:grid;grid-template-columns:1fr 1.05fr;align-items:center;gap:32px;background:var(--pink-soft);border-radius:var(--radius);padding:clamp(28px,4vw,56px)}
.bonus .k{font-weight:600;color:var(--accent);font-size:16px}
.bonus h2{font-size:clamp(26px,2.2vw,32px);margin-top:6px}
.bonus p{font-size:clamp(16px,1.3vw,18px);line-height:1.95;margin-top:14px}
.bonus .shot{border-radius:10px;overflow:hidden;box-shadow:0 18px 40px rgba(52,20,25,.12)}

/* about page */
.ahero{display:grid;grid-template-columns:1fr 280px;gap:clamp(32px,8vw,120px);align-items:center;padding:clamp(48px,6vw,80px) 0 clamp(40px,5vw,60px)}
.ahero h1{font-size:clamp(42px,4.4vw,62px);line-height:1.1;font-weight:600}
.ahero h1 span{font-size:.7em}
.ahero p{font-size:clamp(16px,1.3vw,18px);line-height:1.95;margin-top:28px;max-width:560px}
.ahero .connect{display:inline-block;font-weight:600;font-size:clamp(22px,1.8vw,26px);color:var(--accent);text-decoration:none;margin-top:30px}
.ahero .connect:hover{text-decoration:underline;text-underline-offset:5px}
.ahero .photo{border:1.5px solid #ecbdc9;border-radius:18px;overflow:hidden}
.cv{display:grid;grid-template-columns:1fr 416px;gap:clamp(32px,3vw,40px);padding:clamp(32px,5vw,60px) 0 clamp(64px,9vw,140px)}
.cv h2{font-size:clamp(24px,1.9vw,27px);color:var(--muted);font-weight:600;margin-bottom:20px}
.cv section+section{margin-top:clamp(48px,6vw,70px)}
.box{border:1px solid var(--card-line);border-radius:var(--radius);padding:26px 28px}
.job+.job{margin-top:24px}
.job h3{font-size:16px;font-weight:600}
.job .where{font-weight:600;color:var(--muted);font-size:16px}
.job ul{list-style:none;margin-top:16px;display:grid;gap:12px}
.job li{position:relative;padding-left:14px;font-size:16px;line-height:1.4}
.job li::before{content:"-";position:absolute;left:0;top:-2px;color:var(--muted)}
.edu{display:grid;grid-template-columns:1fr 1fr;gap:30px 30px}
.edu .box{padding:24px 14px 26px}
.edu h3{font-size:20px;font-weight:400}
.edu p{color:var(--muted);font-size:16px;line-height:1.6;margin-top:6px}
.bul{list-style:none;display:grid;gap:12px;padding:6px 0}
.bul li{display:flex;align-items:center;gap:10px;font-size:16px}
.bul li::before{content:"";width:9px;height:9px;border:1.5px solid var(--ink);border-radius:50%}
.tools{display:grid;grid-template-columns:repeat(3,1fr);gap:20px 10px;font-size:16px}
.langs{display:grid;gap:14px;font-size:16px}
.langs div{display:flex;justify-content:space-between;gap:12px}
.langs span{color:var(--muted)}

/* ---------- lightbox / modal / toast ---------- */
.lb{position:fixed;inset:0;z-index:50;background:rgba(20,8,10,.92);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2.5vh;cursor:zoom-out;padding:16px;animation:fade .2s ease-out}
.lb[hidden]{display:none}
.lb img{max-width:min(1600px,100%);max-height:84vh;object-fit:contain}
.lb p{color:rgba(255,255,255,.75);font-size:15px}
.toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);z-index:60;background:#341418;color:#fdfaf8;padding:12px 20px;border-radius:999px;font-size:15px;max-width:calc(100% - 32px);text-align:center;animation:fade .2s}
.toast[hidden]{display:none}
@keyframes fade{from{opacity:0}}
.cm{position:fixed;inset:0;z-index:55;background:rgba(20,8,10,.6);display:flex;align-items:center;justify-content:center;padding:16px;animation:fade .2s}
.cm[hidden]{display:none}
.cm-box{position:relative;background:#fdfaf8;border-radius:20px;padding:40px 28px 30px;width:min(460px,100%);text-align:center;color:#341418;box-shadow:0 20px 60px rgba(52,20,24,.3)}
.cm-x{position:absolute;top:8px;right:10px;width:44px;height:44px;border:0;background:none;font-size:28px;color:#775b53;cursor:pointer}
.cm-l{font-size:13px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:#991a45}
.cm-box h2{font-size:30px;font-weight:600;margin:6px 0 10px}
.cm-e{font-size:17px;color:#775b53;user-select:all;margin-bottom:24px;word-break:break-all}
.cm-b{display:flex;flex-direction:column;gap:10px}
.cm-btn{display:block;font:inherit;font-size:16px;font-weight:600;padding:14px 20px;border-radius:999px;border:1.5px solid #341418;background:none;color:#341418;text-decoration:none;cursor:pointer}
.cm-btn:hover{background:#f4e5e7}
.cm-btn.solid{background:#811838;border-color:#811838;color:#fff}
.cm-btn.solid:hover{background:#341418;border-color:#341418}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:4px}

/* ---------- tablet ---------- */
@media (max-width:1024px){
  .cards{grid-template-columns:repeat(2,1fr)}
  .aboutbox{grid-template-columns:1fr}
  .meta{grid-template-columns:240px 1fr}
  .g4,.stats{grid-template-columns:repeat(2,1fr)}
  .steps{grid-template-columns:repeat(2,1fr);gap:32px 24px}
  .cv{grid-template-columns:1fr}
  .cv aside{display:grid;grid-template-columns:repeat(2,1fr);gap:0 32px;align-items:start}
  .cv aside section:first-child{grid-row:span 2}
  .cv aside section+section{margin-top:0}
  .cv aside section:last-child{margin-top:32px}
}

/* ---------- phone ---------- */
@media (max-width:720px){
  :root{--nav-h:64px;--radius:16px}
  .nav ul{gap:18px}
  .nav ul a{font-size:15px}
  .hero .shape{top:0}
  .hero .btn{margin-top:28px}
  .cards{grid-template-columns:1fr;gap:40px;margin-top:32px}
  .card .ph{aspect-ratio:16/8}
  .aboutbox p{line-height:1.8}
  .footer{grid-template-columns:1fr;text-align:left;gap:36px}
  .footer .arch{order:-1;width:min(220px,62vw)}
  .footer .btns{flex-direction:column;align-items:stretch}
  .footer .btn{min-width:0;width:100%}
  .meta{grid-template-columns:1fr;gap:36px}
  .meta .side{padding-left:0;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:20px}
  .meta .main{gap:28px}
  .banner{aspect-ratio:4/3}
  .g2,.g3,.items,.cols3,.pairs,.band,.next,.bonus,.ahero,.edu,.pcard .row{grid-template-columns:1fr}
  .g4,.stats{grid-template-columns:repeat(2,1fr);gap:12px}
  .g2,.g3{gap:16px}
  .items{gap:56px}
  .cols3{gap:44px}
  .pairs{gap:18px}
  .steps{grid-template-columns:1fr 1fr;gap:28px 16px}
  .steps li{font-size:15.5px;line-height:1.8}
  .band>div,.band>div:first-child,.band>div:last-child{padding:48px var(--gut)}
  .nx{min-height:0}
  .nx .tx,.nx+.nx .tx{padding:40px var(--gut) 24px}
  .stat{padding:18px 16px 24px}
  .stat span{font-size:15px;line-height:1.6}
  .ahero{gap:28px;padding-top:36px}
  .ahero .photo{max-width:300px;order:-1}
  .cv aside{display:block}
  .cv aside section+section,.cv aside section:last-child{margin-top:48px}
  .box{padding:22px 20px}
  .tools{grid-template-columns:repeat(2,1fr)}
  .pcard{padding:14px 14px 18px}
  .pcard .lbl{padding:9px 14px;margin-bottom:18px}
  .bonus{padding:28px 20px;gap:28px}
  .lb p{font-size:13px}
}
@media (max-width:380px){
  .nav ul{gap:14px}
  .logo img{width:108px}
  .g4,.stats{grid-template-columns:1fr}
}

/* extras */
.amelie{grid-template-columns:repeat(3,1fr);grid-template-rows:auto auto}
.amelie>a:first-child{grid-row:span 2}
.logo-box{background:var(--pink);border-radius:var(--radius);padding:0 clamp(16px,15vw,222px)}
.logo-box .fig{border-radius:0}
@media (max-width:720px){
  .amelie{grid-template-columns:1fr 1fr}
  .amelie>a:first-child{grid-row:auto;grid-column:span 2}
  .amelie>a:first-child img{height:auto}
  .logo-box{padding:0 24px}
}
@media (max-width:720px){.hero .shape{width:30px;top:0;opacity:.85}.hero .welcome{width:min(300px,74vw)}}
@media (max-width:720px){.models p{font-size:15px;line-height:1.55}.models h4{font-size:16px;margin-top:14px;line-height:1.3}.models{gap:28px 12px}}