/* Nala Try-On product landing — shared RU / KZ / EN visual system */
.tryon-page{
  --try-green:#b7f064;
  --try-green-strong:#8ed63e;
  --try-cream:#fff9f0;
  --try-paper:#fffdf9;
  --try-ink:#111315;
  --try-muted:#51555a;
  --try-line:#d9d3c8;
  --try-yellow:#fff9b8;
  --try-blue:#e4f2ff;
  --try-pink:#ffe6e5;
  --try-soft-green:#edfbd7;
  background:var(--try-cream);
  color:var(--try-ink);
  font-family:'Inter',Arial,sans-serif;
}
.tryon-page h1,.tryon-page h2,.tryon-page h3,.tryon-page h4,.tryon-page .brand,
.tryon-page .btn,.tryon-page .pill,.tryon-page .tryon-kicker,.tryon-page .tryon-section-head span,
.tryon-page .mini-label,.tryon-page .tryon-badge,.tryon-page .tryon-tags span{
  font-family:'Inter',Arial,sans-serif;
}
.tryon-page h1,.tryon-page h2,.tryon-page h3{text-wrap:wrap}
.tryon-page .wrap{width:min(calc(100% - 40px),1180px)}

/* Header */
.tryon-page .site-header{
  position:relative;
  top:auto;
  height:78px;
  width:min(calc(100% - 40px),1180px);
  margin:0 auto;
  padding:0;
  background:transparent;
  border-bottom:1px solid var(--try-line);
  backdrop-filter:none;
}
.tryon-page .brand{font-size:16px;font-weight:800;letter-spacing:-.02em;gap:10px}
.tryon-page .brand-mark{
  width:38px;height:38px;border:1.5px solid #9aa19b;border-radius:10px;
  background:#fff url("https://tryon.nalacommerce.com/nala-tryon-mark-v2.png") center/88% no-repeat;
  color:transparent;overflow:hidden
}
.tryon-page .nav{gap:26px;font-size:13px;font-weight:600}
.tryon-page .nav>a:not(.pill){padding:29px 0 24px;border-bottom:2px solid transparent;color:#26292c}
.tryon-page .nav>a:not(.pill):hover,.tryon-page .nav>a.active{border-bottom-color:var(--try-green-strong)}
.tryon-page .lang-switch{order:20;border:0;background:transparent;padding:0;gap:18px;font-size:12px}
.tryon-page .lang-switch b{display:none}
.tryon-page .lang-switch a{opacity:1;padding:29px 0 24px;border-bottom:2px solid transparent}
.tryon-page .lang-switch a.active{color:#42a832;border-bottom-color:#42a832}
.tryon-page .pill{order:10;background:var(--try-green);color:#111;border:1.5px solid #202326;padding:10px 17px;font-size:12px}
.tryon-page .pill:hover{box-shadow:none;transform:translateY(-1px);background:#a8e957}

/* Hero */
.tryon-hero{
  margin-top:26px;
  padding:54px 56px;
  border:1px solid var(--try-line);
  border-radius:28px;
  background:rgba(255,253,249,.94);
  overflow:hidden;
}
.tryon-hero-grid{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(350px,.92fr);gap:64px;align-items:center}
.tryon-kicker,
.tryon-section-head span{
  display:inline-flex;align-items:center;gap:9px;width:max-content;
  min-height:30px;padding:7px 13px;border:0;border-radius:999px;
  background:linear-gradient(90deg,#d7ff9a,var(--try-green));
  font-size:11px;line-height:1;font-weight:800;letter-spacing:.015em;text-transform:uppercase
}
.tryon-kicker i{width:7px;height:7px;border-radius:50%;background:#151719}
.tryon-hero h1{
  max-width:700px;margin:20px 0 22px;
  font-size:clamp(44px,4.9vw,67px);line-height:1.03;letter-spacing:-.052em;font-weight:800
}
.tryon-hero h1 .shopify-word{color:#66ad37}
.tryon-lead{max-width:670px;margin:0 0 28px;color:#383c3f;font-size:16px;line-height:1.55}
.tryon-actions{display:flex;gap:12px;flex-wrap:wrap}
.tryon-page .btn{min-height:46px;padding:0 20px;border:1.5px solid #25282b;border-radius:999px;font-size:13px;font-weight:750;box-shadow:none}
.tryon-page .btn:hover{transform:translateY(-1px);box-shadow:none}
.tryon-page .btn.primary{background:var(--try-green);color:#111}
.tryon-page .btn.ghost{background:#fff;color:#111}
.tryon-tags{display:flex;flex-wrap:wrap;gap:9px;margin-top:26px}
.tryon-tags span{
  display:inline-flex;align-items:center;gap:7px;padding:7px 11px;border:1.4px solid #6e7377;border-radius:999px;
  background:#fff;color:#34383b;font-size:9px;font-weight:800;text-transform:uppercase;letter-spacing:.01em
}
.tryon-tags span::before{content:"";width:16px;height:16px;background-size:contain;background-repeat:no-repeat;background-position:center}
.tryon-tags span:nth-child(1)::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23252a2d' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 8V5h3M20 8V5h-3M4 16v3h3M20 16v3h-3'/%3E%3Ccircle cx='9' cy='12' r='2.4'/%3E%3Ccircle cx='15' cy='12' r='2.4'/%3E%3Cpath d='M11.4 12h1.2'/%3E%3C/svg%3E")}
.tryon-tags span:nth-child(2)::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23252a2d' stroke-width='1.8' stroke-linejoin='round'%3E%3Cpath d='M12 3 4.8 7v8l7.2 4 7.2-4V7L12 3Z'/%3E%3Cpath d='m4.8 7 7.2 4 7.2-4M12 11v8'/%3E%3C/svg%3E")}
.tryon-tags span:nth-child(3)::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23252a2d' stroke-width='1.8' stroke-linejoin='round'%3E%3Cpath d='M3.5 6.5h6l2 2H20v9H3.5v-11Z'/%3E%3C/svg%3E")}

.tryon-visual{
  position:relative;min-height:470px;display:grid;place-items:center;
  border-radius:28px;background:#111315;overflow:hidden
}
.tryon-orbit{position:absolute;width:min(360px,84%);aspect-ratio:1;border-radius:50%;border:1.5px solid rgba(164,235,78,.75)}
.tryon-orbit:before,.tryon-orbit:after{content:"";position:absolute;border-radius:50%;border:1px solid rgba(164,235,78,.45)}
.tryon-orbit:before{inset:12%}.tryon-orbit:after{inset:27%}
.tryon-orbit::after{box-shadow:0 0 55px rgba(164,235,78,.13)}
.tryon-mark{
  position:relative;z-index:2;width:210px;aspect-ratio:1;border-radius:48px;
  background:#fff url("https://tryon.nalacommerce.com/nala-tryon-mark-v2.png") center/86% no-repeat;
  box-shadow:11px 12px 0 rgba(183,240,100,.55)
}
.tryon-mark img{opacity:0;width:100%;height:100%}
.tryon-badge{position:absolute;right:22px;bottom:22px;z-index:3;padding:9px 13px;border-radius:999px;background:var(--try-green);font-size:10px;font-weight:800}

/* Sections */
.tryon-section{padding:62px 0 64px;border-bottom:0}
.tryon-section + .tryon-section{padding-top:22px}
.tryon-section-head{display:flex;flex-direction:column;align-items:flex-start;gap:15px;margin-bottom:28px}
.tryon-section-head h2{margin:0;max-width:930px;font-size:clamp(30px,3.2vw,43px);line-height:1.08;letter-spacing:-.042em;font-weight:800}

.tryon-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.tryon-card,.tryon-step{
  position:relative;border:1.5px solid #575b5f;border-radius:22px;background:#fff;
  box-shadow:0 8px 25px rgba(25,28,30,.035)
}
.tryon-card{min-height:330px;padding:24px 24px 26px;display:flex;flex-direction:column}
.tryon-card:nth-child(1){background:#fff}.tryon-card:nth-child(2){background:linear-gradient(145deg,#fffdf1,var(--try-yellow))}.tryon-card:nth-child(3){background:linear-gradient(145deg,#f7fbff,var(--try-blue))}
.tryon-card small,.tryon-step b{display:grid;place-items:center;border-radius:50%;background:#101214;color:#fff;font-size:11px;font-weight:800;line-height:1}
.tryon-card small{width:32px;height:32px}
.tryon-icon{display:block;width:78px;height:78px;margin:14px auto 24px;background-position:center;background-repeat:no-repeat;background-size:contain}
.icon-tryon{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 90 90' fill='none' stroke='%23111315' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M23 31V21h10M67 31V21H57M23 59v10h10M67 59v10H57'/%3E%3Ccircle cx='37' cy='47' r='8' fill='%2399e957'/%3E%3Ccircle cx='53' cy='47' r='8' fill='%2399e957'/%3E%3Cpath d='M45 47h0M40 47h10'/%3E%3C/svg%3E")}
.icon-cube{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 90 90' fill='none' stroke='%23111315' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M45 28 31 36v18l14 8 14-8V36l-14-8Z' fill='%23b7f064'/%3E%3Cpath d='m31 36 14 8 14-8M45 44v18'/%3E%3Cpath d='M18 35a29 29 0 0 1 46-13M72 28l-8-6 1-10M72 55a29 29 0 0 1-46 13M18 62l8 6-1 10'/%3E%3C/svg%3E")}
.icon-folder{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 90 90' fill='none' stroke='%23111315' stroke-width='3' stroke-linejoin='round'%3E%3Cpath d='M18 30h22l7 8h25v31H18V30Z'/%3E%3Cpath d='M50 45h17v19H50z' fill='%2399e957' stroke='none'/%3E%3Cpath d='M57 49c-2 1-3 3-2 5 1 2 5 2 6 4 1 2-1 4-4 4-2 0-4-1-5-2M58 47v17' stroke='%23fff' stroke-width='2'/%3E%3C/svg%3E")}
.tryon-card h3{margin:0 0 10px;font-size:22px;line-height:1.15;letter-spacing:-.03em;font-weight:800}
.tryon-card p{margin:0;color:#3f4347;font-size:14px;line-height:1.6}

.tryon-flow{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}
.tryon-step{min-height:300px;padding:22px 20px 24px;display:flex;flex-direction:column}
.tryon-step:nth-child(1){background:#fff}.tryon-step:nth-child(2){background:linear-gradient(145deg,#fff,var(--try-soft-green))}.tryon-step:nth-child(3){background:linear-gradient(145deg,#fff,var(--try-pink))}.tryon-step:nth-child(4){background:linear-gradient(145deg,#fff,var(--try-blue))}
.tryon-step b{width:32px;height:32px}
.tryon-step .tryon-icon{width:64px;height:64px;margin:14px auto 22px}
.icon-install{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 90 90' fill='none' stroke='%23111315' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M45 18v37M34 44l11 11 11-11' stroke='%2366c73b'/%3E%3Cpath d='M25 62v10h40V62'/%3E%3C/svg%3E")}
.icon-puzzle{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 90 90' fill='none' stroke='%23111315' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M31 27h12c-1-7 3-12 9-12s10 5 9 12h12v13c7-1 12 3 12 9s-5 10-12 9v13H57c1-7-3-12-9-12s-10 5-9 12H27V58c-7 1-12-3-12-9s5-10 12-9V27h4Z'/%3E%3C/svg%3E")}
.icon-sliders{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 90 90' fill='none' stroke='%23111315' stroke-width='3' stroke-linecap='round'%3E%3Cpath d='M20 28h50M20 45h50M20 62h50'/%3E%3Ccircle cx='38' cy='28' r='6' fill='%2399e957'/%3E%3Ccircle cx='56' cy='45' r='6' fill='%2399e957'/%3E%3Ccircle cx='34' cy='62' r='6' fill='%2399e957'/%3E%3C/svg%3E")}
.icon-rocket{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 90 90' fill='none' stroke='%23111315' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M54 19c10 4 17 11 19 22L52 62 31 41c5-11 12-18 23-22Z'/%3E%3Ccircle cx='53' cy='39' r='6'/%3E%3Cpath d='m31 41-12 4 8 8M52 62l-4 12-8-8M31 61l-8 8M36 66l-7 7' stroke='%2366c73b'/%3E%3C/svg%3E")}
.tryon-step h3{margin:0 0 9px;font-size:18px;line-height:1.15;letter-spacing:-.025em;font-weight:800}
.tryon-step p{margin:0;color:#414549;font-size:13px;line-height:1.58}

.tryon-native{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.tryon-panel{position:relative;min-height:300px;padding:30px;border:1.5px solid #575b5f;border-radius:22px;overflow:hidden;display:flex;flex-direction:column}
.tryon-panel.dark{background:#111315;color:#fff}.tryon-panel.light{background:linear-gradient(135deg,#f1ffc8,var(--try-green));color:#111}
.tryon-panel-icon{display:block;width:54px;height:54px;margin-bottom:34px;border:1px solid currentColor;border-radius:50%;background-position:center;background-repeat:no-repeat;background-size:70%}
.icon-admin{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64' fill='none' stroke='%23a8ec56' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M19 21h26l3 31H16l3-31Z'/%3E%3Cpath d='M25 22c0-7 3-11 7-11s7 4 7 11M32 29v16M27 33c2-2 8-2 10 1 2 4-8 4-7 8 1 3 7 3 9 1'/%3E%3C/svg%3E")}
.icon-release{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64' fill='none' stroke='%23111315' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m16 33 29-12v24L16 33Z'/%3E%3Cpath d='M16 33H9v9h9M23 38l4 14h7l-5-17'/%3E%3C/svg%3E")}
.tryon-panel .mini-label{font-size:10px;font-weight:800;letter-spacing:.03em;text-transform:uppercase;opacity:.8}
.tryon-panel h3{margin:auto 0 10px;font-size:27px;line-height:1.08;letter-spacing:-.035em;font-weight:800}
.tryon-panel p{max-width:520px;margin:0;color:#ced0d2;font-size:14px;line-height:1.58}.tryon-panel.light p{color:#303438}
.tryon-status{display:flex;align-items:center;gap:8px;margin-top:18px;font-size:9px;font-weight:800;text-transform:uppercase;letter-spacing:.02em}
.tryon-status i{width:8px;height:8px;border-radius:50%;background:#66c73b}

/* CTA + simple footer */
.tryon-cta{padding:30px 0 26px}
.tryon-cta-inner{
  display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:18px;align-items:center;
  padding:28px 30px;border:1px solid var(--try-line);border-radius:22px;background:rgba(255,253,249,.94)
}
.tryon-cta .mini-label{display:none}
.tryon-cta h2{margin:0;max-width:530px;font-size:clamp(27px,3vw,38px);line-height:1.08;letter-spacing:-.035em;font-weight:800}
.tryon-cta .tryon-actions{display:contents}
.tryon-cta .btn{min-width:170px}
.tryon-page footer.wrap{
  min-height:58px;padding:0 0 24px;border:0;display:grid;grid-template-columns:1fr auto auto;gap:40px;align-items:center;
  color:#555a5e;font-size:11px
}
.tryon-page footer.wrap b{color:#222;font-size:11px;letter-spacing:.02em}
.tryon-page footer.wrap div{display:contents}

@media(max-width:1020px){
  .tryon-page .nav{display:none}
  .tryon-page .menu{display:block}
  .tryon-page .nav.open{display:flex;position:absolute;top:68px;left:0;right:0;z-index:30;flex-direction:column;align-items:stretch;padding:20px;background:#fff;border:1px solid var(--try-line);border-radius:18px;box-shadow:0 18px 40px rgba(0,0,0,.08)}
  .tryon-page .nav.open>a:not(.pill),.tryon-page .lang-switch a{padding:8px 0;border:0}
  .tryon-page .lang-switch{order:0;gap:16px}
  .tryon-page .pill{order:0;width:100%}
  .tryon-hero-grid{grid-template-columns:1fr;gap:34px}.tryon-visual{min-height:390px}
  .tryon-grid{grid-template-columns:1fr}.tryon-flow{grid-template-columns:1fr 1fr}.tryon-native{grid-template-columns:1fr}
  .tryon-cta-inner{grid-template-columns:1fr 1fr}.tryon-cta h2{grid-column:1/-1}
}
@media(max-width:650px){
  .tryon-page .wrap,.tryon-page .site-header{width:min(calc(100% - 24px),1180px)}
  .tryon-page .site-header{height:68px}.tryon-page .brand{font-size:14px}.tryon-page .brand-mark{width:34px;height:34px}
  .tryon-hero{margin-top:14px;padding:28px 22px;border-radius:22px}.tryon-hero h1{font-size:clamp(38px,12vw,52px)}.tryon-hero h1 br{display:none}.tryon-lead{font-size:15px}
  .tryon-visual{min-height:300px;border-radius:22px}.tryon-orbit{width:250px}.tryon-mark{width:150px;border-radius:34px;box-shadow:7px 8px 0 rgba(183,240,100,.55)}
  .tryon-section{padding:48px 0 46px}.tryon-section + .tryon-section{padding-top:8px}.tryon-section-head{gap:12px;margin-bottom:22px}.tryon-section-head h2{font-size:29px}.tryon-section-head span{font-size:10px}
  .tryon-card{min-height:290px}.tryon-flow{grid-template-columns:1fr}.tryon-step{min-height:265px}
  .tryon-native{gap:16px}.tryon-panel{min-height:285px}
  .tryon-cta-inner{grid-template-columns:1fr;padding:24px 20px}.tryon-cta h2{grid-column:auto;font-size:29px}.tryon-cta .tryon-actions{display:flex}.tryon-cta .btn{width:100%}
  .tryon-page footer.wrap{grid-template-columns:1fr;gap:8px;padding-bottom:24px}
}
