:root{--bg:#111014;--panel:#1d1a21;--ink:#f9f7f8;--muted:#b9b2ba;--pink:#ff4d94;--light:#ffffff;--dark:#171419}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.65 system-ui,-apple-system,'Segoe UI',Arial,sans-serif;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button{font:inherit}.wrap{width:min(1160px,calc(100% - 48px));margin:auto}.skip{position:absolute;left:-9999px;background:white;color:black;padding:8px}.skip:focus{left:12px;top:12px;z-index:99}
.header{position:sticky;top:0;z-index:30;background:rgba(17,16,20,.94);border-bottom:1px solid #ffffff14;backdrop-filter:blur(18px)}.header-inner{height:88px;display:flex;align-items:center;justify-content:space-between}.brand{display:flex;align-items:center;gap:12px;line-height:1}.brand-logo{width:66px;height:66px;object-fit:cover;flex:none;border-radius:50%;background:#120f13;box-shadow:0 0 0 1px #ff4d9430,0 10px 24px #00000024}.brand-name{font-size:21px;font-weight:600;letter-spacing:-.7px}.brand-name b{font-weight:850}.brand-name small{display:block;font-size:9px;letter-spacing:2px;margin-top:7px;color:var(--muted);font-weight:700}.nav{display:flex;align-items:center;gap:34px;font-size:13px;font-weight:750}.nav>a:not(.nav-cta):hover,.footer a:hover{color:var(--pink)}.nav-cta{border:1px solid #ffffff44;padding:11px 18px;border-radius:100px}.nav-cta:hover{background:var(--pink);border-color:var(--pink);color:var(--dark)}.menu-toggle{display:none}
h1,h2,h3,p{margin-top:0}h1,h2{font-weight:830;letter-spacing:-.066em;line-height:1.11}h1{font-size:clamp(45px,4.8vw,70px);margin:26px 0}h2{font-size:clamp(39px,4.5vw,64px);margin:22px 0 0}h1 em,.contact h2 em{font-style:normal;color:var(--pink)}h2 span{color:var(--pink)}.eyebrow,.section-kicker{font-size:11px;font-weight:800;letter-spacing:2px;color:var(--pink);text-transform:uppercase}.eyebrow{display:flex;align-items:center;gap:12px}.ping{width:8px;height:8px;background:var(--pink);border-radius:50%;box-shadow:0 0 0 6px #ff4d9422;flex:none}
.hero{position:relative;overflow:hidden;min-height:660px}.hero-glow{position:absolute;width:700px;height:600px;border-radius:50%;right:-280px;top:-220px;background:radial-gradient(circle,#a0235761 0%,transparent 67%);pointer-events:none}.hero-grid{display:grid;grid-template-columns:1.08fr .92fr;align-items:center;min-height:607px;gap:25px}.hero-content{position:relative;z-index:2;padding:42px 0}.hero-lead{font-size:17px;max-width:530px;color:#cbc6cd;line-height:1.9}.hero-lead strong{color:var(--ink);font-weight:800}.actions{display:flex;align-items:center;gap:28px;margin-top:32px}.btn{display:inline-flex;align-items:center;gap:33px;border-radius:100px;padding:15px 24px;font-size:13px;font-weight:800}.btn-pink{background:var(--pink);color:#1c1320}.btn-pink:hover{background:#ff80b2}.btn span{font-size:18px}.text-link{font-size:13px;font-weight:800}.text-link span{margin-left:9px;color:var(--pink)}.hero-art{position:relative;min-height:500px;display:grid;place-items:center}.art-grid{position:absolute;inset:30px;opacity:.35;background-image:linear-gradient(#ffffff13 1px,transparent 1px),linear-gradient(90deg,#ffffff13 1px,transparent 1px);background-size:43px 43px;mask-image:radial-gradient(circle,#000,transparent 70%)}
.huge-smile{width:310px;height:310px;border-radius:50%;background:#ff4d94;position:relative;transform:rotate(-15deg);box-shadow:0 0 90px #ff4d9442,20px 20px 0 #8b2859}.eye{position:absolute;top:90px;width:23px;height:43px;border-radius:100%;background:#24131d}.eye-one{left:93px}.eye-two{right:93px}.smile-line{position:absolute;left:77px;top:145px;width:155px;height:90px;border:16px solid #24131d;border-top:0;border-radius:0 0 140px 140px}.orbit{position:absolute;border:1px solid #ffffff25;border-radius:50%}.orbit-one{width:420px;height:420px}.orbit-two{width:510px;height:510px;border-style:dashed}.float-note{position:absolute;bottom:38px;left:-10px;background:#f8f6f7;color:#1b131b;padding:15px 20px;transform:rotate(-7deg);font-weight:800;font-size:14px;line-height:1.4;box-shadow:0 10px 40px #0003}.float-note strong{color:#f24891}.vertical-text{position:absolute;right:0;top:30px;writing-mode:vertical-rl;letter-spacing:3px;font-size:10px;color:#9b939e}.hero-bottom{display:flex;justify-content:space-between;color:#77717d;font-size:10px;letter-spacing:2px;padding:9px 0 26px}
.section{padding:115px 0;scroll-margin-top:78px}.intro{background:var(--light);color:var(--dark)}.intro-grid{display:grid;grid-template-columns:1fr .78fr;gap:80px}.intro .section-kicker,.work .section-kicker{color:#cd3570}.intro h2 span,.work h2 span{color:#e84b86}.intro-right{padding-top:42px}.intro-right p{font-size:17px;line-height:1.85;color:#58515b}.intro-right strong{color:#1b1720}.mini-tags{display:flex;gap:8px;flex-wrap:wrap;margin-top:24px}.mini-tags span{border:1px solid #d8d2d6;border-radius:50px;padding:6px 13px;font-size:11px;font-weight:800}
.manifesto-heading{max-width:930px}.manifesto-heading>p{max-width:650px;font-size:17px;color:var(--muted);margin:26px 0 40px}.manifesto-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.thought{background:var(--panel);padding:31px;min-height:310px;display:flex;flex-direction:column;border:1px solid #ffffff0f}.thought-number{font-size:11px;color:#8c858f}.thought-symbol{font-size:39px;color:var(--pink);margin:24px 0 17px;line-height:1}.thought h3{font-size:24px;line-height:1.25;letter-spacing:-.04em;margin:0 0 11px}.thought p{font-size:14px;color:#bcb3bd;max-width:270px}

.mission{background:var(--pink);color:#1c1320;overflow:hidden}.mission-inner{padding:10px 0 4px}.mission .section-kicker{color:#7b2d53}.mission h2{font-size:clamp(44px,5.2vw,78px);margin:8px 0 14px}.mission p{font-size:18px;line-height:1.8;color:#3a2130;max-width:720px}
.heading-row{display:flex;align-items:end;justify-content:space-between;gap:65px;margin-bottom:43px}.heading-row>p{max-width:365px;color:var(--muted)}.work{background:var(--light);color:var(--dark)}.work-heading>p{color:#67616c}.project{overflow:hidden;background:white;border:1px solid #e9e5e8}.project-visual{position:relative;min-height:470px;background:#eadde4;display:flex;justify-content:center;align-items:end;padding:80px 50px 0;overflow:hidden}.project-ribbon{position:absolute;left:34px;top:27px;font-size:10px;letter-spacing:2px;font-weight:800;color:#8c6479}.browser{width:min(780px,100%);background:white;box-shadow:0 30px 80px #4b263452;border-radius:13px 13px 0 0;overflow:hidden}.browser-bar{height:36px;background:#f7f7f8;border-bottom:1px solid #e8e8e8;display:flex;align-items:center;justify-content:space-between;padding:0 15px;font-size:9px;color:#999}.browser-dots{display:flex;gap:5px}.browser-dots i{width:7px;height:7px;background:#dad6da;border-radius:50%}.browser-square{width:11px;height:9px;border:1px solid #bbb}.browser-content{padding:22px 30px 0}.shop-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.shop-logo{font-weight:800;font-size:25px;letter-spacing:-1.5px}.shop-logo span{color:#d93682}.shop-logo small{display:block;letter-spacing:2px;font-size:7px;color:#777}.shop-nav{font-size:10px;color:#555}.shop-hero{height:240px;background:#f8edf3;display:flex;justify-content:space-between;padding:35px;overflow:hidden}.shop-hero small{display:block;color:#ce3380;font-size:9px;letter-spacing:2px;font-weight:800}.shop-hero strong{font-size:26px;line-height:1.2;display:block;margin:12px 0;letter-spacing:-1.5px}.shop-button{display:inline-block;background:#d93682;color:#fff;font-size:9px;border-radius:20px;padding:9px 13px}.bags-art{width:200px;position:relative;align-self:stretch}.bottle{position:absolute;bottom:-25px;border-radius:18px 18px 10px 10px;box-shadow:10px 12px 15px #0002}.bottle:before{content:"";position:absolute;width:38%;height:18px;top:-17px;left:31%;background:#ddd;border-radius:3px 3px 0 0}.bottle:after{content:"";position:absolute;left:10%;right:10%;top:35%;height:40%;background:#ffffffb0;border-radius:6px}.b1{height:160px;width:85px;left:16px;background:#f2a8cc;transform:rotate(-9deg)}.b2{height:190px;width:88px;right:15px;background:#9dd9d4;transform:rotate(8deg)}.box-product{position:absolute;bottom:-23px;width:88px;height:110px;left:65px;background:#f8d366;transform:rotate(-4deg);box-shadow:5px 6px 12px #0002}.project-info{padding:33px 35px;display:flex;justify-content:space-between;align-items:center;gap:20px}.project-label{font-size:10px;color:#bc447b;font-weight:800;letter-spacing:1.5px}.project-info h3{font-size:30px;margin:5px 0 8px;letter-spacing:-1.5px}.project-info p{max-width:690px;color:#6d6470;font-size:14px;margin-bottom:0}.circle-link{display:grid;place-items:center;width:52px;height:52px;border-radius:50%;background:#19151b;color:#fff;font-size:25px;flex:none}.circle-link:hover{background:var(--pink)}.project-note{font-size:11px;color:#8a7c86;margin:14px 0 0}
.interlude{background:#171318;border-top:1px solid #ffffff08;overflow:hidden}.interlude-inner{position:relative}.interlude p{font-size:clamp(34px,4.2vw,59px);font-weight:800;letter-spacing:-.06em;line-height:1.25;max-width:960px;margin:25px 0 0}.interlude p em{font-style:normal;color:var(--pink)}.interlude-mark{position:absolute;right:0;bottom:-125px;font-size:290px;line-height:1;color:#ff4d9412;pointer-events:none}
.contact{background:var(--pink);color:#1c1320}.contact .section-kicker{color:#55263d}.contact-grid{display:grid;grid-template-columns:1fr .75fr;gap:100px}.contact h2{font-size:clamp(40px,5vw,70px)}.contact h2 em{color:#fff}.contact-right{padding-top:55px}.contact-right>p{font-size:17px;line-height:1.9}.contact-details{display:flex;flex-direction:column;gap:9px;padding:20px 0 23px;border-top:1px solid #1c132050}.contact-details strong{font-size:20px}.contact-details a{font-weight:700;width:fit-content;overflow-wrap:anywhere}.contact-details a:hover{text-decoration:underline}.contact-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:3px}.contact-actions a{background:#1c1320;color:white;border-radius:30px;padding:12px 21px;font-weight:800;font-size:13px}
.footer{background:#100f12}.footer-inner{min-height:125px;display:flex;align-items:center;justify-content:space-between;gap:20px}.footer-inner>span,.footer-inner>a:last-child{font-size:11px;color:#969099}.footer-brand .brand-logo{width:56px;height:56px}.footer-brand .brand-name{font-size:16px}.footer-brand .brand-name small{letter-spacing:1px;font-size:8px}
@media(max-width:940px){.hero-grid{grid-template-columns:1fr .75fr}.hero-art{min-height:400px}.huge-smile{width:220px;height:220px}.eye{top:65px;width:17px;height:32px}.eye-one{left:65px}.eye-two{right:65px}.smile-line{left:54px;top:110px;width:115px;height:60px;border-width:12px;border-top:0}.orbit-one{width:300px;height:300px}.orbit-two{width:370px;height:370px}.intro-grid,.contact-grid{gap:45px}.intro-right{padding-top:25px}.section{padding:88px 0}}
@media(max-width:700px){.wrap{width:calc(100% - 36px)}.header-inner{height:76px}.brand-logo{width:51px;height:51px}.brand-name{font-size:19px}.brand-name small{font-size:8px;letter-spacing:1px}.menu-toggle{display:flex;flex-direction:column;gap:5px;background:none;border:0;padding:12px;margin-right:-12px;cursor:pointer}.menu-toggle span{width:23px;height:2px;background:white}.nav{display:none;position:absolute;left:0;right:0;top:76px;background:#171419;border-bottom:1px solid #ffffff22;flex-direction:column;align-items:stretch;gap:0;padding:12px 18px 20px}.nav.open{display:flex}.nav a{padding:13px 8px}.nav-cta{margin-top:8px;text-align:center}.hero-grid{display:flex;flex-direction:column;align-items:stretch;gap:0}.hero-content{padding:60px 0 4px}h1{font-size:clamp(41px,10vw,60px)}.eyebrow{letter-spacing:1.1px;font-size:9px}.hero-lead{font-size:15px}.actions{flex-wrap:wrap;gap:18px}.hero-art{min-height:348px}.huge-smile{width:205px;height:205px}.eye{top:62px}.eye-one{left:63px}.eye-two{right:63px}.smile-line{left:54px;top:105px;width:106px;height:58px}.float-note{left:13px;bottom:22px;font-size:10px}.vertical-text{right:5px}.hero-bottom{font-size:8px}.intro-grid,.contact-grid{grid-template-columns:1fr;gap:27px}.intro-right{padding-top:0}.section{padding:77px 0}.manifesto-grid{grid-template-columns:1fr}.thought{min-height:235px}.thought-symbol{margin:13px 0}.heading-row{display:block}.heading-row>p{margin-top:26px}.mission p{font-size:15px}.project-visual{min-height:325px;padding:62px 12px 0}.project-ribbon{left:17px;top:17px}.browser-content{padding:12px 12px 0}.shop-logo{font-size:16px}.shop-nav{font-size:7px}.shop-hero{height:180px;padding:20px 15px}.shop-hero strong{font-size:19px}.bags-art{width:120px;transform:scale(.7);transform-origin:bottom right}.project-info{padding:22px}.project-info h3{font-size:24px}.circle-link{height:44px;width:44px}.interlude-mark{font-size:180px;bottom:-80px}.contact-right{padding-top:0}.footer-inner{padding:24px 0;flex-wrap:wrap}.footer-inner>span{order:3;width:100%}}
@media(prefers-reduced-motion:no-preference){.hero-content{animation:js-intro .85s cubic-bezier(.2,.8,.2,1) both}.hero-art{animation:js-intro 1s .16s cubic-bezier(.2,.8,.2,1) both}.huge-smile{animation:js-smile 7s ease-in-out infinite}.orbit-one{animation:js-orbit 35s linear infinite}.orbit-two{animation:js-orbit 58s linear infinite reverse}.hero-glow{animation:js-glow 9s ease-in-out infinite alternate}.ping{animation:js-ping 2.7s ease-in-out infinite}.float-note{animation:js-note 5s ease-in-out infinite}.btn,.circle-link,.contact-actions a,.nav-cta{transition:transform .2s ease,box-shadow .25s ease,background-color .2s ease}.btn:hover,.contact-actions a:hover,.nav-cta:hover{transform:translateY(-3px);box-shadow:0 12px 30px #ff4d9440}.circle-link:hover{transform:translateY(-3px) rotate(12deg)}.brand-logo{transition:transform .35s ease,filter .35s ease}.brand:hover .brand-logo{transform:rotate(-7deg) scale(1.06);filter:drop-shadow(0 0 10px #ff4d9450)}.thought{transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease}.thought:hover{transform:translateY(-5px);border-color:#ff4d9470;box-shadow:0 22px 55px #0000002c}.project .browser{transition:transform .45s ease,box-shadow .45s ease}.project:hover .browser{transform:translateY(-7px);box-shadow:0 35px 85px #4b263465}.reveal-ready{opacity:0;transform:translateY(26px);transition:opacity .68s ease,transform .68s cubic-bezier(.2,.8,.2,1)}.reveal-ready.is-visible{opacity:1;transform:translateY(0)}}
@keyframes js-intro{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes js-smile{0%,100%{transform:rotate(-15deg) translateY(0)}50%{transform:rotate(-10deg) translateY(-13px)}}@keyframes js-orbit{to{transform:rotate(360deg)}}@keyframes js-glow{to{opacity:.55;transform:translate(-35px,25px) scale(1.12)}}@keyframes js-ping{0%,100%{box-shadow:0 0 0 6px #ff4d9422}50%{box-shadow:0 0 0 12px #ff4d9408}}@keyframes js-note{0%,100%{transform:rotate(-7deg) translateY(0)}50%{transform:rotate(-4deg) translateY(-7px)}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important;animation:none!important}.reveal-ready{opacity:1!important;transform:none!important}}






/* Just Smile v11 - classic, clean layout */
.intro,.work{background:#fff}
.hero{min-height:625px}
.hero-grid{min-height:565px}
.art-grid{display:none}
.orbit{border-color:rgba(255,255,255,.15)}
.orbit-two{border-style:solid;border-color:rgba(255,77,148,.25)}
.manifesto-grid{gap:18px}
.thought{min-height:270px;border:1px solid rgba(255,255,255,.09)}
.work .project{box-shadow:none;border:1px solid #e9e5e8;transform:none;border-radius:0}
.project-visual{background:#f5f0f3}
.project-note{color:#797279}
.interlude-mark{display:none}
.contact::before,.intro::before,.work::before{display:none!important}
/* Typography carries the idea; no star graphic in this section. */
.mission{background:var(--pink);color:#fff;overflow:hidden}
.mission .mission-inner{width:min(860px,calc(100% - 48px));padding:88px 0 92px;min-height:0;display:flex;align-items:center;flex-direction:column;text-align:center}
.mission .mission-text{display:flex;flex-direction:column;gap:19px;max-width:830px;align-items:center}
.mission .mission-text p{color:#fff;font-size:clamp(17px,1.65vw,21px);line-height:1.7;font-weight:550;max-width:820px;margin:0}
.mission h2{color:#fff;font-size:clamp(48px,6.4vw,83px);line-height:1.07;margin:45px 0 0;letter-spacing:-.055em}
.header,.footer{background:#111014}
@media (max-width:700px){
 .hero{min-height:auto}
 .hero-grid{min-height:auto}
 .mission .mission-inner{width:calc(100% - 36px);padding:65px 0 68px}
 .mission .mission-text{gap:18px}
 .mission .mission-text p{font-size:17px;line-height:1.65}
 .mission h2{margin-top:34px;font-size:clamp(42px,11vw,66px)}
 .thought{min-height:220px}
}
/* Only gentle motion, not part of the layout. */
@media(prefers-reduced-motion:no-preference){
 .huge-smile{animation:js-smile 8s ease-in-out infinite}
 .orbit-one{animation:js-orbit 65s linear infinite}
 .orbit-two{animation:js-orbit 90s linear infinite reverse}
 .hero-glow{animation:none}
 .thought:hover{transform:translateY(-3px);box-shadow:none;border-color:rgba(255,77,148,.38)}
 .project:hover .browser{transform:translateY(-3px);box-shadow:0 30px 80px #4b263452}
}


/* v12 – compressed mission copy, clean, conversational rhythm */
.mission .mission-inner{padding:67px 0 72px;width:min(850px,calc(100% - 48px))}
.mission .mission-text{display:block;width:100%;max-width:780px}
.mission .mission-text p{
  color:#3d3038;
  font-size:clamp(16px,1.3vw,18px);
  font-weight:400;
  letter-spacing:0;
  line-height:1.52;
  text-align:left;
  max-width:100%;
  margin:0;
}
.mission h2{margin:26px 0 0;font-size:clamp(46px,5.6vw,74px)}
@media(max-width:700px){
  .mission .mission-inner{width:calc(100% - 36px);padding:48px 0 54px}
  .mission .mission-text p{font-size:16px;line-height:1.52}
  .mission h2{margin-top:24px;font-size:clamp(40px,10vw,60px)}
}