/* ============================================================
   Lami Gemeda — Portfolio (light / white edition)
   ============================================================ */

:root{
  --bg:#fbfaf7; --panel:#f2efe9; --card:#ffffff;
  --ink:#171310; --ink-2:#3c352d; --muted:#736a5d; --faint:#a8a093;
  --accent:#ff5b2e; --accent-ink:#b83c15; --accent-soft:#ffe9e0;
  --line:rgba(23,19,16,.12); --line-soft:rgba(23,19,16,.07);

  --c-social:#ff4f87; --c-ads:#ff7a1a; --c-web:#8fd400; --c-ai:#12b8e6;

  --font-fat:"Archivo",system-ui,sans-serif;
  --font-sans:"Hanken Grotesk",system-ui,sans-serif;
  --font-serif:"Fraunces",Georgia,serif;
  --font-mono:"JetBrains Mono",ui-monospace,monospace;

  --ease:cubic-bezier(.6,.01,.05,.95);
  --ease-out:cubic-bezier(.22,1,.36,1);
  --pad:clamp(1.25rem,5vw,6rem);
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent;}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:88px;}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto;}*,*::before,*::after{animation-duration:.001ms!important;transition-duration:.001ms!important;}}
body{background:var(--bg);color:var(--ink);font-family:var(--font-sans);line-height:1.5;-webkit-font-smoothing:antialiased;overflow-x:hidden;}
body.loading{overflow:hidden;height:100vh;}
a{color:inherit;text-decoration:none;}
img{display:block;max-width:100%;}
em{font-style:italic;}
::selection{background:var(--accent);color:#fff;}

/* warm glow */
.ambient{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden;}
.orb{position:absolute;border-radius:50%;filter:blur(120px);}
.orb--1{width:44vw;height:44vw;top:-14vw;right:-10vw;background:radial-gradient(circle,rgba(255,91,46,.22),transparent 68%);}
.orb--2{width:36vw;height:36vw;bottom:-10vw;left:-10vw;background:radial-gradient(circle,rgba(18,184,230,.14),transparent 70%);}

/* cursor */
.cursor,.cursor-dot{position:fixed;top:0;left:0;z-index:9500;pointer-events:none;border-radius:50%;}
.cursor{width:34px;height:34px;border:1.5px solid var(--ink);transform:translate(-50%,-50%);transition:width .3s var(--ease-out),height .3s var(--ease-out),background .3s,border-color .3s;}
.cursor-dot{width:5px;height:5px;background:var(--accent);transform:translate(-50%,-50%);}
.cursor.is-hover{width:58px;height:58px;background:var(--accent);border-color:var(--accent);}
.cursor.is-view{width:88px;height:88px;background:var(--accent);border-color:var(--accent);}
.cursor.is-view::after{content:"View";color:#fff;font-family:var(--font-mono);font-size:.68rem;}
.cursor.is-hidden,.cursor-dot.is-hidden{opacity:0;}
@media (hover:none),(pointer:coarse){.cursor,.cursor-dot{display:none;}}

/* preloader */
.preloader{position:fixed;inset:0;z-index:9800;background:var(--bg);display:flex;flex-direction:column;justify-content:flex-end;padding:var(--pad);overflow:hidden;transition:transform 1s var(--ease);}
.preloader.is-done{transform:translateY(-101%);}
.preloader__inner{display:flex;justify-content:space-between;align-items:flex-end;border-bottom:1px solid var(--line);padding-bottom:1.2rem;}
.preloader__name{font-family:var(--font-fat);font-weight:900;font-size:clamp(2rem,7vw,4.4rem);line-height:.95;display:flex;gap:.35ch;text-transform:uppercase;letter-spacing:-.01em;}
.preloader__name span{display:inline-block;transform:translateY(110%);opacity:0;animation:rise .9s var(--ease-out) forwards;}
.preloader__name span:nth-child(2){color:var(--accent);animation-delay:.1s;}
.preloader__count{font-family:var(--font-mono);font-size:clamp(2rem,7vw,4rem);font-weight:500;}
.preloader__count i{font-style:normal;font-size:.4em;color:var(--muted);vertical-align:super;}
.preloader__bar{height:2px;background:var(--line);margin-top:1rem;overflow:hidden;}
.preloader__bar span{display:block;height:100%;width:0;background:var(--accent);}
@keyframes rise{to{transform:translateY(0);opacity:1;}}

/* nav */
.nav{position:fixed;top:0;left:0;width:100%;z-index:8000;display:flex;align-items:center;justify-content:space-between;
  padding:1rem var(--pad);background:rgba(251,250,247,.8);backdrop-filter:blur(14px);border-bottom:1px solid transparent;transition:transform .5s var(--ease),border-color .4s;}
.nav.stuck{border-color:var(--line);}
.nav.is-hidden{transform:translateY(-110%);}
.nav__logo{display:flex;align-items:center;gap:.6rem;font-weight:700;}
.nav__logo-mark{font-family:var(--font-fat);font-weight:900;font-size:1.2rem;color:#fff;background:var(--ink);width:34px;height:34px;display:grid;place-items:center;border-radius:9px;letter-spacing:-.03em;}
.nav__logo-text{font-size:.9rem;}
.nav__links{display:flex;gap:2rem;}
.nav__links a{position:relative;font-size:.9rem;font-weight:500;color:var(--ink-2);}
.nav__links a::after{content:"";position:absolute;left:0;bottom:-4px;width:100%;height:1.5px;background:var(--accent);transform:scaleX(0);transform-origin:right;transition:transform .4s var(--ease);}
.nav__links a:hover::after,.nav__links a.is-active::after{transform:scaleX(1);transform-origin:left;}
.nav__links a.is-active{color:var(--ink);}
.nav__cta{display:inline-flex;align-items:center;gap:.5rem;background:var(--accent);color:#fff;padding:.6rem 1.15rem;border-radius:100px;font-size:.85rem;font-weight:600;transition:transform .3s,box-shadow .3s;}
.nav__cta:hover{box-shadow:0 8px 22px rgba(255,91,46,.35);}
.nav__cta-dot{width:7px;height:7px;border-radius:50%;background:#fff;}
.nav__burger{display:none;flex-direction:column;gap:5px;background:none;border:none;cursor:pointer;padding:6px;}
.nav__burger span{width:26px;height:2px;background:var(--ink);transition:.35s var(--ease);}
.nav.menu-open .nav__burger span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.nav.menu-open .nav__burger span:nth-child(2){transform:translateY(-7px) rotate(-45deg);}

.menu{position:fixed;inset:0;z-index:7000;background:var(--panel);display:flex;align-items:center;justify-content:center;clip-path:inset(0 0 100% 0);transition:clip-path .7s var(--ease);}
.menu.is-open{clip-path:inset(0 0 0 0);}
.menu__links{display:flex;flex-direction:column;gap:.3rem;text-align:center;}
.menu__links a{font-family:var(--font-fat);font-weight:800;font-size:clamp(2rem,10vw,3.4rem);display:flex;align-items:baseline;gap:1rem;justify-content:center;text-transform:uppercase;letter-spacing:-.01em;}
.menu__links a i{font-family:var(--font-mono);font-size:.8rem;color:var(--accent);font-style:normal;font-weight:500;}

/* layout */
main{position:relative;z-index:1;}
.section{padding:clamp(4.5rem,11vw,9rem) var(--pad);position:relative;}
.section__head{margin-bottom:clamp(2.2rem,5vw,3.8rem);max-width:60ch;}
.section__num{font-family:var(--font-mono);font-size:.78rem;letter-spacing:.08em;color:var(--accent);text-transform:uppercase;display:block;margin-bottom:.9rem;}
.section__title{font-family:var(--font-fat);font-weight:800;font-size:clamp(2rem,5.5vw,3.6rem);line-height:1.02;letter-spacing:-.02em;}
.section__sub{color:var(--muted);margin-top:1rem;font-size:clamp(.98rem,1.3vw,1.12rem);max-width:52ch;}

/* buttons */
.btn{display:inline-flex;align-items:center;gap:.6rem;font-weight:600;font-size:.95rem;padding:.85rem 1.5rem;border-radius:100px;border:1.5px solid var(--ink);color:var(--ink);transition:transform .3s var(--ease-out),background .3s,color .3s,box-shadow .3s;}
.btn:hover{transform:translateY(-2px);}
.btn--fill{background:var(--accent);border-color:var(--accent);color:#fff;}
.btn--fill:hover{box-shadow:0 12px 28px rgba(255,91,46,.4);}
.btn--ghost:hover{background:var(--ink);color:#fff;}

/* ---------- HERO ---------- */
.hero{min-height:100svh;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;
  padding:clamp(7rem,14vh,10rem) var(--pad) clamp(3rem,7vw,5rem);}
.pill{display:inline-flex;align-items:center;gap:.55rem;border:1px solid var(--line);background:var(--card);padding:.45rem .95rem;border-radius:100px;font-size:.82rem;color:var(--ink-2);margin-bottom:clamp(1.5rem,4vw,2.5rem);}
.pill__dot{width:8px;height:8px;border-radius:50%;background:#25c26a;box-shadow:0 0 0 0 rgba(37,194,106,.6);animation:pulse 2s infinite;}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(37,194,106,.55)}70%{box-shadow:0 0 0 9px rgba(37,194,106,0)}100%{box-shadow:0 0 0 0 rgba(37,194,106,0)}}
.hero__name{font-family:var(--font-fat);font-weight:900;text-transform:uppercase;letter-spacing:-.03em;line-height:.9;
  font-size:clamp(3rem,13vw,10rem);}
.hero__cards{display:flex;justify-content:center;align-items:center;gap:clamp(-1rem,-2vw,0rem);margin:clamp(1.5rem,3vw,2.2rem) 0;perspective:1000px;}
.hero__card{width:clamp(112px,22vw,220px);aspect-ratio:4/5;object-fit:cover;border-radius:16px;border:5px solid #fff;
  box-shadow:0 18px 40px rgba(23,19,16,.22);transition:transform .5s var(--ease-out);}
.hero__card--1{transform:rotate(-8deg);z-index:1;}
.hero__card--2{transform:rotate(4deg) translateY(-14px) scale(1.06);z-index:3;margin:0 -14px;}
.hero__card--3{transform:rotate(-3deg);z-index:2;}
.hero__cards:hover .hero__card--1{transform:rotate(-11deg) translateX(-8px);}
.hero__cards:hover .hero__card--3{transform:rotate(-1deg) translateX(8px);}
.hero__ghost{font-family:var(--font-fat);font-weight:900;text-transform:uppercase;letter-spacing:-.02em;line-height:.92;
  font-size:clamp(1.6rem,7vw,5rem);color:transparent;-webkit-text-stroke:1.5px rgba(23,19,16,.24);}
.hero__intro{max-width:52ch;color:var(--ink-2);font-size:clamp(1rem,1.5vw,1.2rem);margin:clamp(1.6rem,4vw,2.4rem) auto 0;}
.hero__intro strong{color:var(--ink);font-weight:700;}
.hero__cta{display:flex;flex-wrap:wrap;gap:1rem;justify-content:center;margin-top:2rem;}

/* hero entrance + motion (works on touch, no pointer needed) */
.hero__name{opacity:0;transform:translateY(30px);}
.is-loaded .hero__name{opacity:1;transform:none;transition:opacity 1s var(--ease-out) .1s,transform 1s var(--ease-out) .1s;}
.hero__ghost{opacity:0;}
.is-loaded .hero__ghost{animation:heroFade 1s var(--ease-out) .55s forwards;}
.hero__card{opacity:0;}
.is-loaded .hero__card{animation:heroPop .7s var(--ease-out) forwards;}
.is-loaded .hero__card--1{animation-delay:.34s;}
.is-loaded .hero__card--2{animation-delay:.5s;}
.is-loaded .hero__card--3{animation-delay:.66s;}
.is-loaded .hero__cards{animation:floatY 5.5s ease-in-out 1.4s infinite;}
@keyframes heroFade{from{opacity:0;transform:translateY(18px);}to{opacity:1;transform:none;}}
@keyframes heroPop{from{opacity:0;}to{opacity:1;}}
@keyframes floatY{0%,100%{transform:translateY(0);}50%{transform:translateY(-9px);}}
@media (prefers-reduced-motion:reduce){
  .hero__name,.hero__ghost,.hero__card{opacity:1!important;transform:none!important;}
}

/* ---------- TOOLS ---------- */
.tools{background:var(--card);border-top:1px solid var(--line);border-bottom:1px solid var(--line);}
.tools__head{text-align:center;margin-inline:auto;}
.tools__head .section__num{display:inline-block;}
.tools__head .section__sub{margin-inline:auto;}
.tools__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(.8rem,1.6vw,1.2rem);}
.tool{position:relative;display:flex;flex-direction:column;align-items:flex-start;
  background:var(--bg);border:1px solid var(--line);border-radius:18px;padding:clamp(1.2rem,2.4vw,1.7rem);
  overflow:hidden;transition:transform .35s var(--ease-out),box-shadow .35s,border-color .35s;}
.tool::before{content:"";position:absolute;left:0;top:0;bottom:0;width:5px;background:var(--tc);transform:scaleY(0);transform-origin:bottom;transition:transform .4s var(--ease);}
.tool:hover{transform:translateY(-6px);box-shadow:0 22px 44px rgba(23,19,16,.13);border-color:transparent;}
.tool:hover::before{transform:scaleY(1);}
.tool__logo{width:56px;height:56px;display:grid;place-items:center;border-radius:14px;background:var(--panel);margin-bottom:1rem;transition:background .35s,transform .35s;}
.tool:hover .tool__logo{transform:scale(1.06) rotate(-3deg);background:color-mix(in srgb,var(--tc) 15%,#fff);}
.tool__logo img{width:58%;height:58%;object-fit:contain;}
.tool__logo svg{width:60%;height:60%;}
.tool__name{font-family:var(--font-fat);font-weight:700;font-size:clamp(1.05rem,1.6vw,1.2rem);letter-spacing:-.01em;}
.tool__cat{font-family:var(--font-mono);font-size:.68rem;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);margin-top:.25rem;}
.tool__go{position:absolute;top:1.1rem;right:1.2rem;color:var(--faint);font-size:1.05rem;transition:color .3s,transform .3s;}
.tool:hover .tool__go{color:var(--tc);transform:translate(3px,-3px);}

/* ---------- EXPERIENCE ---------- */
.xp__list{border-top:1px solid var(--line);}
.xp__row{display:grid;grid-template-columns:150px 1fr auto;gap:clamp(1rem,3vw,3rem);align-items:center;
  padding:clamp(1.6rem,3.5vw,2.6rem) 0;border-bottom:1px solid var(--line);transition:padding-left .4s var(--ease);}
.xp__row:hover{padding-left:12px;}
.xp__years{font-family:var(--font-fat);font-weight:800;font-size:clamp(1.4rem,3vw,2rem);color:var(--accent);line-height:1;}
.xp__body h3{font-family:var(--font-fat);font-weight:700;font-size:clamp(1.2rem,2.4vw,1.7rem);letter-spacing:-.01em;margin-bottom:.35rem;}
.xp__body p{color:var(--muted);font-size:.98rem;max-width:52ch;}
.xp__icon{width:54px;height:54px;border-radius:14px;background:var(--panel);display:grid;place-items:center;flex-shrink:0;}
.xp__icon img{width:60%;height:60%;object-fit:contain;}
.xp__icon i{font-size:1.4rem;}

/* ---------- SERVICES (swing tags on light) ---------- */
.services{background:var(--panel);}
.rackwrap{position:relative;}
.cable{position:absolute;top:95px;left:calc(var(--pad)*-1);right:calc(var(--pad)*-1);height:8px;border-radius:8px;z-index:4;
  background:linear-gradient(180deg,#2c2924,#141210);box-shadow:0 3px 8px rgba(0,0,0,.28);}
.rack{display:flex;gap:clamp(1rem,2vw,2rem);overflow-x:auto;scroll-snap-type:x proximity;scrollbar-width:none;cursor:grab;
  padding:36px 0 1rem;margin:0 calc(var(--pad)*-1);padding-left:var(--pad);padding-right:var(--pad);}
.rack::-webkit-scrollbar{display:none;}
.rack.dragging{cursor:grabbing;scroll-snap-type:none;}
.tag{scroll-snap-align:center;flex:0 0 clamp(260px,78vw,320px);position:relative;padding-top:96px;transform-origin:50% -10px;animation:sway 6s var(--ease) infinite;}
.tag:nth-child(2){animation-delay:-1.5s;}.tag:nth-child(3){animation-delay:-3s;}.tag:nth-child(4){animation-delay:-4.5s;}
@keyframes sway{0%,100%{transform:rotate(-.8deg);}50%{transform:rotate(.8deg);}}
.tag:hover{animation-play-state:paused;}
.tag__tab{position:absolute;top:0;left:50%;transform:translateX(-50%);z-index:3;width:108px;height:120px;border-radius:18px;background:var(--c);display:flex;flex-direction:column;align-items:center;justify-content:space-between;padding:14px 0 12px;box-shadow:0 8px 20px rgba(0,0,0,.2);}
.tag__tab b{font-family:var(--font-fat);font-weight:800;font-size:.72rem;letter-spacing:.12em;color:#0c0a09;}
.tag__tab i{font-family:var(--font-mono);font-size:.6rem;color:rgba(0,0,0,.55);font-style:normal;}
.tag__hole{width:30px;height:30px;border-radius:50%;background:var(--panel);box-shadow:inset 0 2px 5px rgba(0,0,0,.55);}
.tag__card{position:relative;z-index:1;border-radius:22px;overflow:hidden;box-shadow:0 24px 50px rgba(23,19,16,.22);}
.tag__top{background:#12100e;padding:1.9rem 1.4rem 1.4rem;display:flex;justify-content:flex-start;}
.tag__title{font-family:var(--font-fat);font-weight:900;font-size:clamp(3rem,12vw,4.4rem);line-height:.82;color:var(--c);letter-spacing:-.01em;text-transform:uppercase;white-space:nowrap;}
.tag__panel{background:color-mix(in srgb,var(--c) 18%,#141210);padding:1.5rem 1.4rem 1.8rem;}
.tag__label{font-family:var(--font-fat);font-weight:800;font-size:.7rem;letter-spacing:.14em;color:var(--c);}
.tag__svc{font-family:var(--font-fat);font-weight:500;font-size:clamp(1.3rem,3.4vw,1.7rem);text-transform:uppercase;letter-spacing:.01em;margin:.3rem 0 1.4rem;color:#fff;}
.tag__tl{margin-bottom:1.4rem;}
.tag__row{list-style:none;display:flex;justify-content:space-between;gap:.3rem;}
.tag__row li{font-family:var(--font-sans);font-weight:700;font-size:.6rem;color:rgba(255,255,255,.85);text-transform:uppercase;letter-spacing:.02em;flex:1;text-align:center;}
.tag__line{position:relative;height:1px;background:rgba(255,255,255,.35);margin:.45rem 0;}
.tag__line span{position:absolute;top:-3px;width:0;height:0;border-left:4px solid transparent;border-right:4px solid transparent;border-bottom:6px solid rgba(255,255,255,.6);transform:translateX(-50%);}
.tag__line span:nth-child(1){left:12.5%;}.tag__line span:nth-child(2){left:37.5%;}.tag__line span:nth-child(3){left:62.5%;}.tag__line span:nth-child(4){left:87.5%;}
.tag__ghost{font-family:var(--font-fat);font-weight:200;font-size:clamp(2rem,6vw,2.6rem);color:rgba(255,255,255,.16);letter-spacing:.02em;border-top:1px dashed rgba(255,255,255,.25);padding-top:1rem;white-space:nowrap;}

/* ---------- MANAGED SOCIALS (light cards) ---------- */
.totals{display:flex;flex-wrap:wrap;gap:clamp(1.5rem,5vw,4.5rem);margin-bottom:2.6rem;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:1.7rem 0;}
.total__num{font-family:var(--font-fat);font-weight:800;font-size:clamp(2rem,5vw,3.2rem);line-height:1;display:block;}
.total p{font-family:var(--font-mono);font-size:.72rem;color:var(--muted);text-transform:uppercase;letter-spacing:.04em;margin-top:.5rem;}
.slider{overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scrollbar-width:none;cursor:grab;margin:0 calc(var(--pad)*-1);padding:0 var(--pad) 1.5rem;}
.slider::-webkit-scrollbar{display:none;}
.slider.dragging{cursor:grabbing;scroll-snap-type:none;}
.slider.dragging *{pointer-events:none;}
.slider__track{display:flex;gap:clamp(1rem,2vw,1.6rem);width:max-content;}
.social{scroll-snap-align:center;flex:0 0 clamp(280px,80vw,380px);position:relative;border-radius:20px;overflow:hidden;background:var(--card);border:1px solid var(--line);padding:1.6rem;min-height:420px;display:flex;flex-direction:column;transition:transform .5s var(--ease),box-shadow .4s;}
.social::after{content:"";position:absolute;top:0;left:0;right:0;height:5px;background:var(--cg);}
.social:hover{transform:translateY(-6px);box-shadow:0 22px 44px rgba(23,19,16,.14);}
.social__head{display:flex;align-items:center;gap:.75rem;}
.social__icon{width:44px;height:44px;border-radius:12px;display:grid;place-items:center;color:#fff;background:var(--cg);flex-shrink:0;}
.social__icon svg{width:23px;height:23px;}
.social__plat{font-family:var(--font-mono);font-size:.7rem;color:var(--muted);text-transform:uppercase;letter-spacing:.06em;}
.social__managed{margin-left:auto;font-family:var(--font-mono);font-size:.62rem;text-transform:uppercase;letter-spacing:.08em;border:1px solid var(--line);border-radius:100px;padding:.3rem .6rem;color:var(--muted);}
.social__handle{font-family:var(--font-fat);font-weight:800;font-size:clamp(1.5rem,3.6vw,2rem);line-height:1.05;margin-top:1.2rem;letter-spacing:-.01em;}
.social__tagline{color:var(--muted);font-size:.85rem;margin-top:.3rem;}
.social__stats{margin-top:auto;display:flex;flex-direction:column;padding-top:1.4rem;}
.social__stat{display:flex;align-items:baseline;justify-content:space-between;gap:1rem;padding:.7rem 0;border-top:1px solid var(--line-soft);}
.social__stat:first-child{border-top:0;}
.social__stat-num{font-family:var(--font-fat);font-weight:800;font-size:clamp(1.6rem,4.5vw,2.4rem);line-height:1;}
.social__stat-label{font-family:var(--font-mono);font-size:.66rem;color:var(--muted);text-transform:uppercase;letter-spacing:.05em;}
.social__visit{margin-top:1.3rem;display:inline-flex;align-items:center;gap:.5rem;font-family:var(--font-mono);font-size:.8rem;color:var(--muted);transition:color .3s,gap .3s;}
.social__visit:hover{color:var(--accent);gap:.8rem;}
.slider__bar{display:flex;align-items:center;gap:1.5rem;margin-top:1.5rem;}
.slider__progress{flex:1;height:2px;background:var(--line);position:relative;overflow:hidden;border-radius:2px;}
.slider__progress span{position:absolute;left:0;top:0;height:100%;width:18%;background:var(--accent);transition:width .25s var(--ease-out);}
.slider__nav{display:flex;align-items:center;gap:1rem;}
.slider__count{font-family:var(--font-mono);font-size:.8rem;color:var(--muted);}
.slider__count b{color:var(--ink);}
.slider__btn{width:46px;height:46px;border-radius:50%;border:1.5px solid var(--line);background:var(--card);color:var(--ink);font-size:1.1rem;cursor:pointer;transition:background .3s,color .3s,transform .3s,border-color .3s;}
.slider__btn:hover{background:var(--accent);color:#fff;border-color:var(--accent);}
.slider__btn:active{transform:scale(.92);}

/* ---------- DEGREE / certificate ---------- */
.credential{background:var(--panel);text-align:center;}
.credential .section__head{margin-inline:auto;}
.credential .section__num,.credential .section__title{display:block;}
.cred__grid{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(2rem,5vw,4rem);max-width:1000px;margin:0 auto;align-items:center;text-align:left;}
.diploma-stage{perspective:1400px;}
.diploma{position:relative;text-align:center;color:#241f17;border-radius:8px;overflow:hidden;padding:clamp(2.2rem,5.5vw,3.6rem) clamp(1.6rem,5vw,3.2rem);
  background:radial-gradient(120% 100% at 50% 0%,#fbf6ea,#f1e7d2 60%,#e7d9bd);border:1px solid #c9962f;
  box-shadow:0 32px 70px rgba(23,19,16,.28),inset 0 0 0 1px rgba(255,255,255,.4);transition:transform .35s var(--ease-out);transform-style:preserve-3d;}
.diploma::before{content:"";position:absolute;inset:13px;border:1.5px solid rgba(125,84,19,.55);border-radius:4px;pointer-events:none;}
.diploma::after{content:"";position:absolute;inset:18px;border:1px solid rgba(125,84,19,.28);border-radius:3px;pointer-events:none;}
.diploma>*{position:relative;z-index:2;}
.diploma__sheen{position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(115deg,transparent 38%,rgba(255,255,255,.6) 50%,transparent 62%);transform:translateX(-130%);animation:sheen 7s ease-in-out infinite;}
@keyframes sheen{0%,72%{transform:translateX(-130%);}88%,100%{transform:translateX(130%);}}
.diploma__corner{position:absolute;width:26px;height:26px;border:2px solid #c9962f;z-index:2;}
.diploma__corner--tl{top:22px;left:22px;border-right:0;border-bottom:0;}
.diploma__corner--tr{top:22px;right:22px;border-left:0;border-bottom:0;}
.diploma__corner--bl{bottom:22px;left:22px;border-right:0;border-top:0;}
.diploma__corner--br{bottom:22px;right:22px;border-left:0;border-top:0;}
.diploma__eyebrow{font-family:var(--font-mono);font-size:.72rem;letter-spacing:.25em;text-transform:uppercase;color:#a9781f;display:block;margin-bottom:1.3rem;}
.diploma__pre{font-family:var(--font-serif);font-style:italic;font-size:clamp(.9rem,1.6vw,1.05rem);color:#6b5d44;margin:.55rem 0;}
.diploma__name{font-family:var(--font-serif);font-weight:400;font-size:clamp(2.2rem,7vw,3.4rem);line-height:1;color:#241f17;letter-spacing:-.01em;}
.diploma__degree{font-family:var(--font-fat);font-weight:800;text-transform:uppercase;letter-spacing:.02em;font-size:clamp(1.15rem,3.4vw,1.8rem);line-height:1.15;color:#7d5413;margin:.5rem 0 1.5rem;}
.diploma__focus{list-style:none;display:flex;flex-wrap:wrap;gap:.5rem;justify-content:center;margin-bottom:1.9rem;}
.diploma__focus li{font-family:var(--font-mono);font-size:.66rem;text-transform:uppercase;letter-spacing:.04em;color:#6b5d44;border:1px solid rgba(125,84,19,.4);border-radius:100px;padding:.35rem .75rem;}
.diploma__foot{display:flex;align-items:center;justify-content:space-between;gap:1rem;border-top:1px solid rgba(125,84,19,.3);padding-top:1.3rem;}
.diploma__sign{font-family:var(--font-serif);font-style:italic;font-size:clamp(.95rem,2vw,1.3rem);color:#241f17;text-align:left;}
.dseal{width:clamp(70px,15vw,92px);height:clamp(70px,15vw,92px);flex-shrink:0;}
.dseal__ring{transform-origin:100px 100px;animation:dspin 32s linear infinite;}
@keyframes dspin{to{transform:rotate(360deg);}}
.cred__photo{border-radius:18px;overflow:hidden;border:7px solid #fff;box-shadow:0 26px 50px rgba(23,19,16,.2);}
.cred__photo img{width:100%;aspect-ratio:4/5;object-fit:cover;}
/* degree section — float like the hero cards (composes with the diploma's 3D tilt) */
.cred__item:nth-child(2){transition-delay:.14s;}
.diploma-stage{animation:floatCert 4.2s ease-in-out infinite;}
.cred__photo{animation:floatPhoto 4.8s ease-in-out .4s infinite;}
@keyframes floatCert{0%{transform:translateY(0) rotate(-1.4deg);}50%{transform:translateY(-22px) rotate(1.2deg);}100%{transform:translateY(0) rotate(-1.4deg);}}
@keyframes floatPhoto{0%{transform:translateY(-6px) rotate(3.2deg);}50%{transform:translateY(-26px) rotate(.4deg);}100%{transform:translateY(-6px) rotate(3.2deg);}}
@media (prefers-reduced-motion:reduce){.diploma-stage,.cred__photo{animation:none;}}

/* ---------- ABOUT ---------- */
.about__grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:clamp(2rem,6vw,5rem);align-items:start;}
.about__portrait{position:sticky;top:14vh;border-radius:18px;overflow:hidden;border:1px solid var(--line);box-shadow:0 24px 50px rgba(23,19,16,.14);}
.about__portrait img{width:100%;aspect-ratio:3/4;object-fit:cover;}
.about__block{margin-bottom:2rem;}
.about__block:last-child{margin-bottom:0;}
.about__k{font-family:var(--font-mono);font-size:.74rem;letter-spacing:.1em;text-transform:uppercase;color:var(--accent);margin-bottom:.7rem;}
.about__block p{color:var(--ink-2);font-size:clamp(1.02rem,1.4vw,1.18rem);line-height:1.65;}
.about__block p a{color:var(--accent);border-bottom:1px solid var(--accent);}
.about__lead p{font-family:var(--font-serif);font-size:clamp(1.5rem,3vw,2.3rem);line-height:1.22;color:var(--ink);font-weight:350;letter-spacing:-.01em;}

/* ---------- CONTACT ---------- */
.contact{background:var(--ink);color:#fff;}
.contact .section__num{color:var(--accent-2,#ff9c6e);}
.contact__grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2.5rem,6vw,5rem);align-items:center;}
.contact__title{font-family:var(--font-fat);font-weight:900;text-transform:uppercase;letter-spacing:-.02em;line-height:.95;font-size:clamp(2.6rem,7vw,5rem);}
.contact__title em{color:var(--accent);}
.contact__lead{color:rgba(255,255,255,.7);margin-top:1.3rem;font-size:clamp(1rem,1.4vw,1.15rem);max-width:42ch;}
.contact__direct{margin-top:2rem;display:flex;flex-direction:column;gap:.8rem;}
.contact__mail{font-family:var(--font-serif);font-style:italic;font-size:clamp(1.3rem,3vw,2rem);color:#fff;border-bottom:1px solid rgba(255,255,255,.3);padding-bottom:.15rem;align-self:flex-start;transition:color .3s,border-color .3s;}
.contact__mail:hover{color:var(--accent);border-color:var(--accent);}
.contact__socials{display:flex;flex-wrap:wrap;gap:1.4rem;font-family:var(--font-mono);font-size:.85rem;margin-top:.5rem;}
.contact__socials a{color:rgba(255,255,255,.65);transition:color .3s;}
.contact__socials a:hover{color:#fff;}
.form{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.12);border-radius:18px;padding:clamp(1.6rem,3.5vw,2.4rem);}
.form__row{margin-bottom:1.1rem;}
.form label{display:block;font-family:var(--font-mono);font-size:.72rem;text-transform:uppercase;letter-spacing:.06em;color:rgba(255,255,255,.6);margin-bottom:.5rem;}
.form input,.form textarea{width:100%;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.16);border-radius:12px;padding:.85rem 1rem;color:#fff;font-family:inherit;font-size:1rem;transition:border-color .3s,background .3s;}
.form input::placeholder,.form textarea::placeholder{color:rgba(255,255,255,.35);}
.form input:focus,.form textarea:focus{outline:none;border-color:var(--accent);background:rgba(255,255,255,.09);}
.form textarea{resize:vertical;min-height:120px;}
.form__btn{width:100%;justify-content:center;margin-top:.4rem;cursor:pointer;}
.form__hp{position:absolute;left:-9999px;}

/* footer */
.footer{display:flex;flex-wrap:wrap;gap:1rem;justify-content:space-between;align-items:center;padding:2rem var(--pad);border-top:1px solid var(--line);font-family:var(--font-mono);font-size:.78rem;color:var(--muted);position:relative;z-index:1;}

/* reveals */
.reveal-up,.reveal-fade{opacity:0;transition:opacity .9s var(--ease-out),transform .9s var(--ease-out);}
.reveal-up{transform:translateY(38px);}
.reveal-up.in,.reveal-fade.in{opacity:1;transform:none;}
.reveal-line span{display:inline-block;transform:translateY(110%);opacity:0;}
.reveal-line.in span{transform:translateY(0);opacity:1;transition:transform 1s var(--ease-out),opacity .8s;}
.xp__row:nth-child(2){transition-delay:.06s;}.xp__row:nth-child(3){transition-delay:.1s;}.xp__row:nth-child(4){transition-delay:.14s;}

/* responsive */
@media (max-width:980px){
  .tools__grid{grid-template-columns:repeat(2,1fr);}
  .cred__grid{grid-template-columns:1fr;text-align:center;max-width:520px;}
  .cred__photo{max-width:360px;margin:0 auto;transform:rotate(0);}
}
@media (max-width:900px){
  html{overflow-x:clip;}
  .nav__links,.nav__cta{display:none;}
  .nav__burger{display:flex;}
  .about__grid{grid-template-columns:1fr;}
  .about__portrait{position:relative;top:0;max-width:340px;}
  .contact__grid{grid-template-columns:1fr;}
  .xp__row{grid-template-columns:auto 1fr;grid-template-areas:"years icon" "body body";row-gap:.9rem;}
  .xp__years{grid-area:years;}.xp__icon{grid-area:icon;justify-self:end;}.xp__body{grid-area:body;}
}
@media (max-width:600px){
  .hero__ghost{-webkit-text-stroke-width:1px;}
  .hero__card{border-width:4px;}
  .totals{gap:1.3rem 2rem;}
  .total__num{font-size:1.9rem;}
  .tool__logo{width:48px;height:48px;}
}
@media (max-width:440px){
  .tools__grid{grid-template-columns:1fr;}
}
@media (max-width:540px){
  .footer{justify-content:flex-start;gap:.6rem 1.5rem;}
}