/* AZ Dezigns: luminous gradients, precise grids, and layered product storytelling. */
.studio,.nailify {
  --fg: #0a2540;
  --muted: #52657c;
  --line: #e5ebf1;
  --accent: #635bff;
  --max: 1120px;
  background: #fff;
  color: var(--fg);
  font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;
}
.studio { isolation:isolate; }
.studio .shell,.nailify .shell { width:min(var(--max),calc(100% - 64px)); }
.studio .nav-row,.nailify .nav-row { height:88px; border:0; position:relative; z-index:2; }
.studio .brand-star { color:#635bff; }
.studio .nav-row nav a,.nailify .nav-row nav a { font-size:14px; font-weight:600; }
.studio .nav-row nav a:last-child { padding:6px 15px; background:#ffffff70; border-radius:30px; }
.studio main { position:relative; }
.gradient-field {
  position:absolute; z-index:-1; top:-240px; left:0; width:100%; height:700px;
  background:radial-gradient(ellipse at 76% 35%,#ffad73 0,transparent 45%),radial-gradient(ellipse at 30% 25%,#f783c1 0,transparent 47%),radial-gradient(ellipse at 92% 65%,#8b74f7 0,transparent 44%),linear-gradient(115deg,#99e5ff,#b5bdff 48%,#f39bc8);
  clip-path:polygon(0 0,100% 0,100% 68%,0 100%);
  background-size:140% 140%; animation:gradient-drift 16s ease-in-out infinite alternate;
}
.launch-hero { display:grid; grid-template-columns:1.08fr 1fr; min-height:685px; padding-top:53px; padding-bottom:70px; gap:16px; }
.launch-copy { position:relative; z-index:2; padding-top:20px; }
.announcement { display:inline-flex; align-items:center; gap:9px; font-size:11px; background:#0a254010; padding:5px 12px; border-radius:30px; margin-bottom:28px; }
.announcement span { font-weight:700; padding-right:9px; border-right:1px solid #0a254030; }
.announcement b { font-size:18px; line-height:1; }
.launch-copy h1 { font-size:clamp(56px,5.5vw,78px); font-weight:700; line-height:1.06; letter-spacing:-4px; margin:0 0 29px; }
.launch-copy>p { font-size:18px; line-height:1.65; max-width:435px; margin:0 0 27px; color:var(--muted); }
.hero-actions { display:flex; align-items:center; gap:25px; }
.primary-link { display:inline-flex; align-items:center; gap:22px; border-radius:30px; color:white; background:#0a2540; padding:9px 17px; font-size:14px; font-weight:600; transition:background .2s,transform .2s; }
.primary-link:hover { background:#344b62; transform:translateY(-2px); }
.primary-link span,.secondary-link span { transition:transform .2s; }
.primary-link:hover span,.secondary-link:hover span { transform:translateX(3px); }
.secondary-link { display:inline-flex; gap:12px; align-items:center; font-size:14px; font-weight:600; }
.product-stage { position:relative; width:100%; min-width:0; height:560px; margin-top:15px; }
.style-panel { position:absolute; left:90px; top:65px; width:470px; height:318px; background:#fffffff2; border-radius:10px; box-shadow:0 30px 75px -20px #18345b55,0 1px 4px #0a25400a; transform:rotate(-5deg); overflow:hidden; }
.panel-heading { display:flex; align-items:center; padding:16px 18px; font-size:12px; font-weight:600; gap:10px; border-bottom:1px solid #edf0f5; }
.panel-heading>span:last-child { margin-left:auto; color:#abb5c3; }
.panel-mark { color:#7b66dd; font-size:21px; }
.panel-body { display:flex; height:260px; }
.panel-sidebar { width:115px; flex-shrink:0; background:#f6f8fc; padding:20px 10px; font-size:9px; display:flex; flex-direction:column; gap:13px; color:#6a7890; }
.panel-sidebar b { padding-left:7px; color:#243852; }.panel-sidebar>span { padding:5px 7px; }.panel-sidebar .selected { background:#e9e8fb; color:#635bff; border-radius:4px; }
.panel-main { padding:22px; flex:1; }.panel-main>small { font-size:7px; letter-spacing:1px; color:#8491a5; }.panel-main h3 { font-size:17px; letter-spacing:-.5px; margin:5px 0 17px; }
.mini-collection { display:grid; grid-template-columns:1fr 1fr; gap:12px; }.mini-collection b { display:block; font-size:8px; margin-top:9px; }.mini-collection small { display:block; font-size:7px; color:#8390a3; }
.color-art { display:block; height:100px; border-radius:6px; position:relative; overflow:hidden; }.color-art:before,.color-art:after { content:''; position:absolute; width:32px; height:67px; border-radius:50% 50% 30% 30%; transform:rotate(-25deg); box-shadow:inset 4px 2px 5px #fff8,4px 8px 8px #38205418; top:20px; left:20px; background:#c795b9; }.color-art:after { left:58px; top:11px; background:#eedddf; }.color-art-one { background:#f4eaf1; }.color-art-two { background:#e5e6f9; }.color-art-two:before { background:#745ae0; }.color-art-two:after { background:#c6bcff; }
.phone-preview { position:absolute; left:22px; top:118px; width:230px; padding:9px; border:1px solid #e9edf4; background:white; border-radius:30px; box-shadow:0 28px 50px -10px #18345b55,0 3px 10px #193b4e12; transform:rotate(-7deg); }
.phone-status { font-size:7px; display:flex; justify-content:space-between; padding:5px 12px 7px; }.phone-title { font-size:24px; letter-spacing:-1px; font-family:Georgia,serif; color:#632139; padding:0 9px 9px; }.phone-title span { float:right; font-size:18px; }
.phone-photo { position:relative; }.phone-photo img { height:208px; width:100%; object-fit:cover; border-radius:8px; }.phone-photo>span { position:absolute; bottom:9px; left:9px; font-size:6px; letter-spacing:1px; color:#fff; background:#501e2d90; padding:3px 6px; border-radius:3px; }
.phone-detail { padding:12px 8px 8px; }.phone-detail>small { font-size:6px; letter-spacing:1px; color:#95788c; }.phone-detail h3 { font-size:17px; margin:3px 0 12px; letter-spacing:-.5px; }.swatch-row { display:flex; align-items:center; gap:7px; }.swatch-row i { width:20px; height:20px; background:#721a32; border-radius:50%; }.swatch-row i:nth-child(2){background:#bc889a}.swatch-row i:nth-child(3){background:#dab4c0}.swatch-row i:nth-child(4){background:#d8c3ab}.swatch-row i:nth-child(5){background:#655b9c}.swatch-row span { font-size:7px; color:#7d8895; }
.preview-pill { background:#7559a0; color:white; border-radius:6px; padding:8px 9px; font-size:8px; margin-top:17px; }.preview-pill span { float:right; }
.floating-note { position:absolute; right:-3px; bottom:57px; display:flex; align-items:center; gap:12px; background:#fff; border:1px solid #f0eef5; border-radius:10px; padding:15px 19px; box-shadow:0 15px 45px #19345525; transform:rotate(3deg); font-size:12px; font-weight:600; }.floating-note>span { display:grid; place-items:center; width:35px; height:35px; background:#f0eaff; border-radius:50%; color:#8061d6; font-size:24px; }.floating-note small { display:block; font-size:9px; color:#8490a2; font-weight:400; margin-top:3px; }.concept-label { position:absolute; bottom:1px; right:70px; color:#738498; font-size:8px; letter-spacing:1.5px; }
.studio-values { border-top:1px solid var(--line); display:flex; align-items:center; gap:40px; padding-top:31px; padding-bottom:46px; }.studio-values>span { font-size:12px; color:#7a8799; }.studio-values>div { display:flex; flex:1; justify-content:space-between; gap:24px; }.studio-values>div>span { color:#635bff; font-size:22px; display:flex; align-items:center; gap:10px; }.studio-values b { font-size:14px; color:#344b62; }
.products-band { background:#f6f9fc; padding:103px 0 125px; overflow:hidden; }.product-intro { display:grid; grid-template-columns:1fr 1fr; gap:65px; }.kicker { color:#635bff; font-size:15px; font-weight:600; display:block; margin-bottom:21px; }.product-copy h2,.studio-dark h2,.next-chapter h2 { font-size:40px; line-height:1.18; letter-spacing:-1.6px; margin:0 0 24px; font-weight:650; }.product-copy p { color:var(--muted); line-height:1.75; font-size:16px; margin:0 0 25px; max-width:430px; }.product-identity { display:flex; align-items:center; gap:12px; margin:35px 0 22px; }.product-identity b { font-size:19px; }.product-identity small { display:block; color:#7a8799; font-size:11px; }.product-copy h3 { font-size:24px; letter-spacing:-.7px; line-height:1.3; margin:0 0 17px; }.purple-link { background:#635bff; }.purple-link:hover{background:#7972ff}.product-capabilities { display:flex; flex-wrap:wrap; gap:8px; margin-top:25px; }.product-capabilities span { font-size:10px; color:#64748b; background:#eaf0f7; padding:4px 8px; border-radius:4px; }
.product-feature-visual { position:relative; align-self:center; min-height:500px; }.image-window { position:absolute; top:5px; left:35px; width:380px; background:white; border-radius:12px; padding:10px; box-shadow:0 24px 55px #17334e20; z-index:1; transform:rotate(3deg); }.image-window-heading { padding:8px 6px 16px; display:flex; align-items:center; justify-content:space-between; }.image-window-heading>span:first-child { font-family:Georgia,serif; color:#73263d; font-size:23px; }.image-window-heading>span:last-child { font-size:8px; color:#7a8799; }.image-window img { height:385px; width:100%; object-fit:cover; border-radius:6px; }.style-spec { position:absolute; bottom:6px; left:0; right:55px; border-radius:9px; background:white; box-shadow:0 10px 40px #14314920; z-index:2; display:flex; gap:13px; align-items:center; padding:20px; font-size:14px; }.spec-dot { width:34px; height:34px; border-radius:50%; background:#712339; box-shadow:inset 4px 3px 5px #ffffff50; }.style-spec small { display:block; font-size:10px; color:#738398; }.style-spec>span:last-child { margin-left:auto; color:#8772cb; }.visual-grid { position:absolute; inset:50px -25px 25px; background-image:linear-gradient(#dfe6f1 1px,transparent 1px),linear-gradient(90deg,#dfe6f1 1px,transparent 1px); background-size:40px 40px; transform:rotate(-8deg); mask-image:linear-gradient(120deg,transparent,black); }
.studio-dark { background:#0a2540; color:white; padding:100px 0 110px; clip-path:polygon(0 4%,100% 0,100% 96%,0 100%); margin-top:-28px; }.studio-dark .kicker { color:#80e9ff; }.studio-dark-intro { display:grid; grid-template-columns:1.2fr 1fr; gap:65px; align-items:end; }.studio-dark-intro>p { color:#adbdcc; font-size:16px; line-height:1.8; max-width:400px; margin:0 0 24px; }.principle-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:45px; margin-top:55px; }.principle-icon { color:#7ce2fd; font-size:30px; }.principle-grid h3 { font-size:16px; border-left:2px solid #6fe3fb; padding-left:15px; margin:18px 0 14px; }.principle-grid p { color:#adbdcc; font-size:14px; line-height:1.8; margin:0; }
.next-chapter { display:grid; grid-template-columns:1fr 1.2fr; gap:75px; padding-top:95px; padding-bottom:100px; }.next-links { display:grid; grid-template-columns:1fr 1fr; gap:40px; padding-top:15px; }.next-links>div>span { color:#635bff; font-size:13px; font-weight:600; }.next-links h3 { font-size:15px; }.next-links p { color:#52657c; font-size:13px; }.next-links a { display:block; color:#635bff; font-size:12px; font-weight:600; margin-top:9px; }.studio .footer { border-top:1px solid #e5ebf1; }
/* Nailify shares the studio's product language, with its own softer colors. */
.nailify { --wine:#433a7d; position:relative; isolation:isolate; }
.nailify:before { content:''; position:absolute; z-index:-1; top:0; left:0; width:100%; height:670px; background:radial-gradient(ellipse at 90% 0,#a9dafa,transparent 60%),radial-gradient(ellipse at 45% 10%,#e4c1fb,transparent 50%),linear-gradient(135deg,#fff,#f4e3f2); clip-path:polygon(0 0,100% 0,100% 70%,0 100%); }
.nailify .nailify-hero { gap:65px; padding-top:55px; padding-bottom:80px; }
.nailify-intro h1 { font-family:inherit; font-weight:700; font-size:clamp(52px,5.6vw,76px); letter-spacing:-3px; line-height:1.07; }
.nailify-intro h1 em { color:#7861c9; font-style:normal; font-weight:700; }
.nailify-intro p { font-size:17px; color:#52657c; }
.nailify .eyebrow { color:#7861c9; font-size:10px; letter-spacing:1px; }
.nailify-cta { background:#635bff; border-radius:30px; padding:10px 20px; font-size:14px; gap:25px; }
.nailify-cta:hover { background:#7972ff; }
.nailify .nailify-visual { transform:rotate(3deg); padding:10px; background:#fff; border-radius:20px; box-shadow:0 25px 65px #27356625; align-self:center; }
.nailify .nailify-visual>img { border-radius:12px; height:505px; }
.nailify .look-label { border-radius:10px; left:-35px; background:#fff; box-shadow:0 15px 35px #243e5820; }
.nailify .look-label>div { font-family:inherit; font-size:16px; font-weight:600; }
.nailify .look-label small { font-weight:400; }
.nailify .vertical-note { display:none; }
.nailify .platform-note { color:#65758b; }
.nailify .nailify-ribbon { font-family:inherit; font-style:normal; font-size:17px; font-weight:600; background:#f6f9fc; color:#52657c; padding-block:30px; }
.nailify .nailify-ribbon span:nth-child(even) { color:#8d7be3; }
.nailify .features-heading h2,.nailify .nailify-ending h2 { font-family:inherit; font-size:45px; font-weight:650; letter-spacing:-1.7px; }.nailify .features-heading h2 em,.nailify .nailify-ending h2 em { font-style:normal; font-weight:650; color:#8474d1; }
.nailify .features-heading>p,.nailify .feature p,.nailify .simulation-note { color:#52657c; }
.nailify .feature-art { border-radius:12px; }
.nailify .feature h3 { font-family:inherit; font-size:20px; font-weight:600; }
.nailify .feature p { font-size:14px; }
.nailify .feature .feature-fine { font-size:11px; }
.nailify .nailify-ending { background:#0a2540; color:#fff; clip-path:polygon(0 7%,100% 0,100% 100%,0 100%); padding-top:80px; }.nailify .nailify-ending .eyebrow { color:#90dcff; }.nailify .nailify-ending h2 em { color:#b4a9ff; }
@keyframes gradient-drift { from{background-position:0 40%}to{background-position:100% 70%} }
@media(min-width:1250px) { .launch-copy h1{font-size:78px}.launch-hero{gap:35px} }
@media(max-width:1100px) {
  .launch-copy h1{font-size:62px;letter-spacing:-3px}.launch-copy>p{font-size:16px}.product-stage{transform:scale(.86);transform-origin:left center;width:116%}.launch-hero{overflow:clip;min-height:620px}.announcement{font-size:9px;gap:6px;padding-inline:9px}.product-intro{gap:30px}.image-window{width:320px;left:20px}.style-spec{right:0}.product-copy h2,.studio-dark h2,.next-chapter h2{font-size:35px}.studio-values{gap:25px}.studio-values b{font-size:12px}.studio-values>div{gap:15px}.nailify .nailify-hero{gap:35px}.nailify .nailify-intro h1{font-size:60px}.next-chapter{gap:40px}
}
@media(max-width:760px) {
  .studio .shell,.nailify .shell{width:calc(100% - 40px)}.studio .nav-row,.nailify .nav-row{height:76px}.studio .nav-row nav{gap:17px}.studio .nav-row nav a,.nailify .nav-row nav a{font-size:11px}.studio .nav-row nav a:last-child{padding:5px 9px}.gradient-field{top:-180px;height:610px;clip-path:polygon(0 0,100% 0,100% 69%,0 100%)}
  .launch-hero{grid-template-columns:1fr;padding-top:27px;padding-bottom:28px;gap:0;overflow:visible}.launch-copy{padding-top:0}.announcement{font-size:10px;margin-bottom:24px}.launch-copy h1{font-size:clamp(47px,9vw,65px);letter-spacing:-2.7px}.launch-copy>p{font-size:16px;max-width:460px}.hero-actions{gap:22px}.primary-link,.secondary-link{font-size:13px}.product-stage{transform:none;width:100%;height:540px;margin-top:25px;overflow:hidden}.style-panel{width:400px;left:70px;top:48px}.phone-preview{left:15px;top:101px}.floating-note{right:5px;bottom:35px}.concept-label{right:25px;bottom:0}.panel-sidebar{width:90px}.panel-main{padding:20px 15px}.studio-values{display:block;padding:25px 0 32px}.studio-values>div{margin-top:20px;flex-wrap:wrap;justify-content:start;gap:20px}.studio-values>div>span{font-size:17px}.studio-values b{font-size:11px}
  .products-band{padding:60px 0 80px}.product-intro{grid-template-columns:1fr;gap:40px}.kicker{font-size:13px;margin-bottom:18px}.product-copy h2,.studio-dark h2,.next-chapter h2{font-size:35px}.product-copy p{max-width:100%;font-size:15px}.product-feature-visual{min-height:485px;max-width:450px;width:100%;margin:auto}.image-window{width:calc(100% - 50px);left:25px}.image-window img{height:375px}.style-spec{bottom:0;right:20px;font-size:13px}.studio-dark{padding:80px 0;clip-path:polygon(0 2%,100% 0,100% 98%,0 100%)}.studio-dark-intro{grid-template-columns:1fr;gap:0}.studio-dark-intro>p{font-size:15px;max-width:none}.principle-grid{grid-template-columns:1fr;gap:27px;margin-top:25px}.principle-grid h3{margin-top:10px}.principle-icon{font-size:25px}.principle-grid p{max-width:440px}.next-chapter{grid-template-columns:1fr;gap:40px;padding-top:60px;padding-bottom:60px}.next-links{gap:25px}
  .nailify .nailify-hero{padding-top:30px;gap:40px;padding-bottom:55px}.nailify .nailify-intro h1{font-size:60px}.nailify .nailify-intro p{font-size:16px}.nailify .nailify-visual{margin:0 10px;transform:rotate(2deg)}.nailify .nailify-visual>img{height:450px}.nailify .look-label{left:-15px;right:15px;padding:15px}.nailify .nailify-ribbon{font-size:14px;gap:8px}.nailify .nailify-ribbon span:nth-child(even){font-size:16px}.nailify .features-heading h2,.nailify .nailify-ending h2{font-size:36px}.nailify .feature-grid{gap:32px}.nailify .feature{grid-template-columns:1fr}.nailify .feature-art{grid-row:auto;height:220px;margin-bottom:18px}.nailify .nail-sample{width:48px;height:100px}.nailify .polish-art{gap:16px}.nailify .art-caption{font-size:7px}.nailify .mini-look{width:135px}.nailify .mini-look img{height:145px}.nailify .feature h3{font-size:22px}.nailify .feature p{font-size:14px}.nailify .nailify-ending{padding-top:65px}
}
@media(max-width:380px) { .launch-copy h1{font-size:43px}.announcement{font-size:8px}.primary-link,.secondary-link{font-size:11px}.hero-actions{gap:15px}.phone-preview{width:207px}.phone-photo img{height:190px}.style-panel{left:45px}.floating-note{font-size:10px;padding:12px}.next-links{grid-template-columns:1fr}.studio .brand{font-size:19px}.studio .nav-row nav{gap:9px}.studio .nav-row nav a{font-size:10px}.nailify .nailify-intro h1{font-size:51px} }
@media(prefers-reduced-motion:reduce) { .gradient-field{animation:none} }
