/* PLATONIK KIMYA | V10 continuous liquid-light background
   Transparent section treatments keep a single atmospheric layer visible from hero to footer.
   Performance: composited transform/opacity only, no canvas, videos, or new fonts. */
:root { --v10-ink:#111f4c; --v10-lavender:#c2a9ff; --v10-violet:#987adf; --v10-cyan:#49d8e6; }
body.site--platonik { background:#101b49; isolation:isolate; }
.site--platonik .aurora-stage {
  position:fixed; inset:0; z-index:0; overflow:hidden;
  pointer-events:none; user-select:none; isolation:isolate;
  background:
    radial-gradient(ellipse 82% 57% at 16% 14%,rgba(35,116,199,.65),transparent 72%),
    radial-gradient(ellipse 58% 65% at 88% 85%,rgba(140,85,195,.38),transparent 72%),
    linear-gradient(132deg,#101d4b 0%,#18396f 38%,#263b84 65%,#44336f 100%);
}
.site--platonik .aurora-orb {position:absolute;display:block;aspect-ratio:1;border-radius:48% 52% 57% 43% / 54% 43% 57% 46%;will-change:transform;backface-visibility:hidden;transform:translate3d(0,0,0)}
.site--platonik .aurora-orb--cyan {width:min(95vw,1300px);left:-28%;top:-35%;opacity:.68;background:radial-gradient(ellipse at 48% 49%,rgba(65,233,240,.88) 0%,rgba(24,141,225,.48) 30%,rgba(39,106,203,.15) 56%,transparent 74%);animation:aurora-drift-a 34s ease-in-out infinite alternate}
.site--platonik .aurora-orb--lilac {width:min(95vw,1380px);right:-25%;top:2%;opacity:.82;background:radial-gradient(ellipse at 47% 48%,rgba(206,151,251,.77) 0%,rgba(133,103,215,.51) 31%,rgba(100,95,197,.16) 57%,transparent 76%);animation:aurora-drift-b 39s ease-in-out infinite alternate}
.site--platonik .aurora-orb--pearl {width:min(80vw,1170px);left:11%;bottom:-48%;opacity:.45;background:radial-gradient(circle at 50% 50%,rgba(241,233,255,.79),rgba(179,195,252,.31) 31%,rgba(149,177,246,.12) 57%,transparent 72%);animation:aurora-drift-c 42s ease-in-out infinite alternate}
.site--platonik .aurora-orb--pink {width:min(69vw,970px);right:-29%;bottom:-28%;opacity:.52;background:radial-gradient(circle at center,rgba(232,152,208,.6),rgba(170,96,187,.32) 37%,transparent 73%);animation:aurora-drift-d 47s ease-in-out infinite alternate}
.site--platonik .aurora-lustre {position:absolute;inset:-30%;background:conic-gradient(from 200deg at 54% 48%,transparent 0deg,rgba(161,195,253,.075) 55deg,transparent 113deg,rgba(252,208,254,.10) 180deg,transparent 235deg,rgba(86,217,241,.075) 310deg,transparent 360deg);animation:aurora-turn 90s linear infinite;mix-blend-mode:screen}
.site--platonik .aurora-grain {position:absolute;inset:0;opacity:.24;background-image:repeating-linear-gradient(45deg,#fff0 0 35px,#ffffff07 36px,#fff0 37px 78px);mix-blend-mode:soft-light}
@keyframes aurora-drift-a{0%{transform:translate3d(0,0,0) rotate(-9deg) scale(1)}50%{transform:translate3d(28%,18%,0) rotate(11deg) scale(1.15)}100%{transform:translate3d(48%,-2%,0) rotate(22deg) scale(.9)}}
@keyframes aurora-drift-b{0%{transform:translate3d(0,0,0) rotate(6deg) scale(1)}50%{transform:translate3d(-25%,24%,0) rotate(-8deg) scale(1.08)}100%{transform:translate3d(-45%,-19%,0) rotate(-16deg) scale(1.16)}}
@keyframes aurora-drift-c{0%{transform:translate3d(0,0,0) scale(.91)}50%{transform:translate3d(-14%,-28%,0) scale(1.12)}100%{transform:translate3d(35%,-44%,0) scale(.95)}}
@keyframes aurora-drift-d{0%{transform:translate3d(0,0,0) scale(1)}100%{transform:translate3d(-46%,-43%,0) scale(1.23)}}
@keyframes aurora-turn {to{transform:rotate(360deg)}}

/* All sections use the SAME fixed colour source, rather than resetting hard backgrounds. */
.site--platonik main,.site--platonik .footer {position:relative;z-index:1}
.site--platonik main > section {position:relative}
.site--platonik .hero {
  background:linear-gradient(95deg,rgba(8,24,70,.76) 0%,rgba(13,37,89,.61) 54%,rgba(43,37,96,.27) 100%);
}
.site--platonik .hero-art {opacity:.14;mix-blend-mode:screen}
.site--platonik .hero-shade {
  background:linear-gradient(90deg,rgba(9,25,66,.59),rgba(13,36,76,.24) 53%,rgba(45,34,92,.08));
}
.site--platonik .hero-product-scene::before {opacity:.45}
.site--platonik .technology {
  background:linear-gradient(118deg,rgba(15,38,108,.49),rgba(24,70,146,.51) 50%,rgba(27,100,168,.32));
}
.site--platonik .product-section {
  background:linear-gradient(115deg,rgba(11,33,88,.61),rgba(24,56,127,.55) 55%,rgba(18,61,136,.47));
}
.site--platonik .shopping-section {
  background:linear-gradient(135deg,rgba(41,29,101,.64) 0%,rgba(69,51,126,.54) 51%,rgba(125,73,141,.47));
}
/* Light chapters retain dark text and product contrast, but let the same palette glow through. */
.site--platonik .cinematic {
  background:linear-gradient(121deg,rgba(250,249,255,.93),rgba(242,242,253,.85) 55%,rgba(227,223,248,.77));
}
.site--platonik .cinematic-background {
  background:radial-gradient(ellipse at 75% 43%,rgba(184,168,240,.2),transparent 62%),
    linear-gradient(115deg,rgba(254,253,255,.42),rgba(246,243,255,.25));
  animation:none;
}
.site--platonik .about-section {
  background:linear-gradient(110deg,rgba(251,251,255,.94),rgba(242,241,253,.87) 55%,rgba(227,224,245,.78));
}
.site--platonik .about-glow {opacity:.22}
.site--platonik .footer {
  background:linear-gradient(115deg,rgba(11,24,66,.87),rgba(27,24,77,.85));
}
/* Transitions: thin beams carry the same light from one chapter to the next. */
.site--platonik main > section:not(.hero)::after {
  content:"";position:absolute;left:7%;right:7%;bottom:0;height:1px;
  background:linear-gradient(90deg,transparent,rgba(179,225,255,.24),rgba(216,185,255,.27),transparent);
  pointer-events:none;z-index:7;
}
/* A soft glass surface behind product labels enhances readability while moving colour stays underneath. */
.site--platonik .product-card {
  background:radial-gradient(ellipse at 47% 35%,rgba(180,179,244,.28),transparent 72%),linear-gradient(145deg,rgba(41,76,149,.77),rgba(20,43,102,.87));
  border:1px solid rgba(230,229,255,.4);
}
.site--platonik .tech-visual {background:radial-gradient(circle at 30% 22%,rgba(245,247,255,.39),rgba(133,150,230,.23) 59%,rgba(29,58,130,.42));}
/* Motion pause on hidden tabs is linked to the document visibility state. */
.site--platonik.aurora-paused .aurora-orb,.site--platonik.aurora-paused .aurora-lustre {animation-play-state:paused}
/* On a mobile GPU use fewer, smaller, gentler effects and no large backdrop blurs. */
@media (max-width:650px){
  .site--platonik .aurora-orb--cyan {width:135vw;left:-63%;top:-9%;opacity:.59;animation-duration:43s}
  .site--platonik .aurora-orb--lilac {width:144vw;right:-73%;top:18%;opacity:.72;animation-duration:46s}
  .site--platonik .aurora-orb--pearl {width:129vw;left:-15%;bottom:-26%;opacity:.3}
  .site--platonik .aurora-orb--pink {display:none}
  .site--platonik .aurora-lustre {opacity:.5;animation-duration:110s}
  .site--platonik .hero-art{opacity:.09}
  .site--platonik .cinematic {background:linear-gradient(180deg,rgba(250,249,255,.94),rgba(241,240,253,.84))}
  .site--platonik .about-section {background:linear-gradient(180deg,rgba(250,249,255,.94),rgba(234,231,251,.87))}
  .site--platonik .product-card {background:radial-gradient(ellipse at 53% 32%,rgba(183,181,242,.23),transparent 70%),linear-gradient(140deg,rgba(32,62,139,.85),rgba(22,42,97,.88))}
}
@media (prefers-reduced-motion:reduce){
  .site--platonik .aurora-orb,.site--platonik .aurora-lustre {animation:none!important;will-change:auto!important}
}
@media (prefers-reduced-data:reduce){
  .site--platonik .aurora-orb--pearl,.site--platonik .aurora-orb--pink,.site--platonik .aurora-lustre,.site--platonik .aurora-grain{display:none}
}