:root { --blue:#082fd8; --orange:#ff7415; --ink:#0b1640; --muted:#67708a; --paper:#f7f8fc; }
* { box-sizing:border-box; }
html, body { margin:0; min-height:100%; background:var(--paper); }
body { color:var(--ink); font-family:Arial,"Noto Sans Georgian",system-ui,sans-serif; }

.site-shell {
  position:relative; display:flex; min-height:100svh; overflow:hidden; flex-direction:column;
  padding:30px clamp(24px,5vw,78px) 24px; isolation:isolate;
  background:radial-gradient(circle at 67% 45%,rgba(23,71,255,.09),transparent 31%),linear-gradient(135deg,#fff 0%,#f8f9fe 52%,#f0f3ff 100%);
}
.site-shell::before { position:absolute; z-index:-1; top:0; right:0; width:38vw; height:100%; border-left:1px solid rgba(8,47,216,.06); content:""; transform:skewX(-12deg) translateX(12%); background:linear-gradient(180deg,rgba(255,255,255,.78),rgba(211,220,255,.22)); }
.ambient { position:absolute; z-index:-1; border-radius:999px; pointer-events:none; }
.ambient-one { top:-18vw; right:-14vw; width:45vw; height:45vw; border:1px solid rgba(8,47,216,.1); }
.ambient-two { right:24vw; bottom:-29vw; width:48vw; height:48vw; border:1px solid rgba(255,116,21,.1); }

.topbar { display:flex; z-index:2; align-items:center; justify-content:space-between; }
.brand-logo { display:block; width:144px; height:auto; mix-blend-mode:multiply; }
.language-pill { display:flex; align-items:center; gap:10px; min-height:40px; border:1px solid rgba(8,47,216,.12); border-radius:999px; padding:0 16px; color:#8088a0; background:rgba(255,255,255,.67); box-shadow:0 8px 30px rgba(30,50,120,.06); font-size:11px; font-weight:700; letter-spacing:.16em; backdrop-filter:blur(12px); }
.language-pill .active { color:var(--blue); }
.language-pill .divider { width:1px; height:12px; background:#d9ddec; }

.hero { display:grid; flex:1; grid-template-columns:minmax(0,1.02fr) minmax(430px,.98fr); align-items:center; gap:clamp(42px,6vw,110px); width:min(1380px,100%); margin:0 auto; padding:clamp(50px,7vh,90px) 0 clamp(34px,5vh,64px); }
.hero-copy { z-index:2; max-width:720px; }
.status-pill { display:inline-flex; align-items:center; gap:10px; margin-bottom:28px; border:1px solid rgba(8,47,216,.12); border-radius:999px; padding:10px 15px 9px; color:#59647e; background:rgba(255,255,255,.7); box-shadow:inset 0 1px 0 #fff,0 10px 30px rgba(13,44,150,.05); font-size:11px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; backdrop-filter:blur(12px); }
.status-dot { width:8px; height:8px; border-radius:50%; background:var(--orange); box-shadow:0 0 0 5px rgba(255,116,21,.12); animation:pulse 2.4s ease-out infinite; }
.status-separator { color:#c4c9d8; }
h1 { margin:0; font-size:clamp(46px,5.7vw,88px); font-weight:800; letter-spacing:-.065em; line-height:.98; }
h1 span { display:block; color:var(--blue); }
.english-title { margin:24px 0 0; color:#3f4965; font-size:clamp(18px,1.5vw,23px); font-weight:600; letter-spacing:-.02em; }
.copy-rule { width:58px; height:3px; margin:30px 0 25px; border-radius:99px; background:var(--orange); }
.development-copy { max-width:570px; color:var(--muted); font-size:14px; line-height:1.65; }
.development-copy p { margin:0; }
.development-copy p:first-child { color:#35405e; font-weight:700; }

.visual-wrap { position:relative; display:grid; min-height:490px; place-items:center; perspective:1200px; }
.loan-card { position:relative; width:min(455px,78%); aspect-ratio:1.58; overflow:hidden; border:1px solid rgba(255,255,255,.45); border-radius:30px; padding:30px; color:white; background:radial-gradient(circle at 90% 7%,rgba(255,255,255,.3),transparent 19%),linear-gradient(135deg,#153ee8 0%,#062abf 45%,#061b85 100%); box-shadow:0 44px 80px rgba(4,30,144,.25),inset 0 1px 0 rgba(255,255,255,.38); transform:rotateY(-8deg) rotateX(3deg) rotateZ(-2deg); animation:card-float 6s ease-in-out infinite; }
.card-gloss { position:absolute; inset:0; background:linear-gradient(115deg,transparent 26%,rgba(255,255,255,.16) 45%,transparent 63%); transform:translateX(-100%); animation:gloss 5.5s 1.2s ease-in-out infinite; }
.card-topline,.card-footer { position:relative; z-index:1; display:flex; align-items:center; justify-content:space-between; font-size:12px; font-weight:800; letter-spacing:.17em; }
.card-tag { border:1px solid rgba(255,255,255,.35); border-radius:999px; padding:6px 10px; font-size:9px; }
.currency-mark { position:absolute; top:46px; right:30px; color:rgba(255,255,255,.07); font-size:176px; font-weight:800; line-height:1; }
.card-message { position:absolute; z-index:1; bottom:61px; left:30px; }
.card-message strong,.card-message span { display:block; }
.card-message strong { font-size:19px; letter-spacing:-.02em; }
.card-message span { margin-top:7px; color:rgba(255,255,255,.65); font-size:12px; letter-spacing:.04em; }
.card-footer { position:absolute; right:30px; bottom:27px; left:30px; color:rgba(255,255,255,.45); font-size:9px; }
.card-dashes { display:flex; gap:4px; }
.card-dashes i { width:18px; height:3px; border-radius:9px; background:var(--orange); }
.orbit { position:absolute; border-radius:50%; }
.orbit-one { width:470px; height:470px; border:1px solid rgba(8,47,216,.09); }
.orbit-two { width:380px; height:380px; border:1px dashed rgba(8,47,216,.12); animation:spin 28s linear infinite; }
.floating-note { position:absolute; display:flex; z-index:2; align-items:center; gap:12px; min-width:170px; border:1px solid rgba(8,47,216,.09); border-radius:18px; padding:13px 15px; background:rgba(255,255,255,.8); box-shadow:0 20px 50px rgba(11,35,120,.12),inset 0 1px 0 #fff; backdrop-filter:blur(15px); }
.floating-note b,.floating-note small { display:block; }
.floating-note b { color:#26314f; font-size:12px; }
.floating-note small { margin-top:4px; color:#8a91a5; font-size:9px; }
.note-icon { display:grid; flex:0 0 auto; width:32px; height:32px; place-items:center; border-radius:11px; color:white; background:var(--blue); font-size:13px; font-weight:800; box-shadow:0 8px 16px rgba(8,47,216,.22); }
.note-icon.orange { background:var(--orange); box-shadow:0 8px 16px rgba(255,116,21,.22); }
.note-top { top:48px; right:0; }
.note-bottom { bottom:46px; left:-5px; }

footer { display:flex; z-index:2; align-items:flex-end; justify-content:space-between; gap:32px; border-top:1px solid rgba(8,47,216,.08); padding-top:18px; color:#8a91a5; font-size:10px; line-height:1.5; letter-spacing:.02em; }
footer p { margin:0; }
footer p:first-child { color:#4a5571; font-weight:700; letter-spacing:.09em; text-transform:uppercase; }
footer p:last-child { max-width:660px; text-align:right; }
footer span { margin-left:8px; }

@keyframes pulse { 0%,100%{box-shadow:0 0 0 5px rgba(255,116,21,.12)} 50%{box-shadow:0 0 0 9px rgba(255,116,21,0)} }
@keyframes card-float { 0%,100%{transform:rotateY(-8deg) rotateX(3deg) rotateZ(-2deg) translateY(0)} 50%{transform:rotateY(-5deg) rotateX(1deg) rotateZ(-1deg) translateY(-10px)} }
@keyframes gloss { 0%,35%{transform:translateX(-110%)} 65%,100%{transform:translateX(115%)} }
@keyframes spin { to{transform:rotate(360deg)} }

@media (max-width:980px) {
  .hero { grid-template-columns:1fr .86fr; gap:16px; }
  .visual-wrap { min-height:390px; }
  .loan-card { width:92%; }
  .orbit-one { width:370px; height:370px; }
  .orbit-two { width:300px; height:300px; }
  .floating-note { transform:scale(.86); }
  .note-top { right:-24px; }
  .note-bottom { left:-30px; }
}

@media (max-width:760px) {
  html, body { min-height:100%; overflow-x:hidden; }
  body { touch-action:pan-y; }
  .site-shell {
    height:100svh;
    min-height:650px;
    overflow:hidden;
    padding:calc(15px + env(safe-area-inset-top)) 18px calc(13px + env(safe-area-inset-bottom));
  }
  .site-shell::before { height:100%; }
  .brand-logo { width:102px; }
  .language-pill { min-height:32px; gap:8px; padding:0 12px; font-size:9px; }
  .hero {
    grid-template-columns:1fr;
    grid-template-rows:auto minmax(205px,1fr);
    align-items:stretch;
    gap:10px;
    padding:clamp(20px,3.5vh,30px) 0 12px;
  }
  .status-pill { margin-bottom:15px; padding:8px 12px 7px; font-size:8px; }
  .status-dot { width:6px; height:6px; }
  h1 { font-size:clamp(34px,10.2vw,46px); letter-spacing:-.058em; line-height:1.01; }
  .english-title { margin-top:12px; font-size:15px; }
  .copy-rule { width:42px; height:2px; margin:15px 0 13px; }
  .development-copy { font-size:11px; line-height:1.45; }
  .visual-wrap { min-height:205px; height:100%; max-height:300px; }
  .loan-card { width:min(328px,80vw); border-radius:22px; padding:20px; }
  .card-topline { font-size:10px; }
  .card-tag { padding:5px 8px; font-size:7px; }
  .currency-mark { top:26px; right:20px; font-size:104px; }
  .card-message { bottom:42px; left:20px; }
  .card-message strong { font-size:14px; }
  .card-message span { margin-top:4px; font-size:9px; }
  .card-footer { right:20px; bottom:18px; left:20px; font-size:7px; }
  .card-dashes i { width:13px; height:2px; }
  .orbit-one { width:min(290px,75vw); height:min(290px,75vw); }
  .orbit-two { width:min(225px,59vw); height:min(225px,59vw); }
  .floating-note { min-width:140px; gap:9px; padding:8px 10px; border-radius:14px; transform:scale(.78); }
  .floating-note b { font-size:10px; }
  .floating-note small { margin-top:2px; font-size:7px; }
  .note-icon { width:27px; height:27px; border-radius:9px; }
  .note-top { top:0; right:-10px; transform-origin:top right; }
  .note-bottom { bottom:0; left:-10px; transform-origin:bottom left; }
  footer { align-items:flex-start; flex-direction:column; gap:5px; padding-top:9px; font-size:8px; line-height:1.35; }
  footer p:last-child { max-width:none; text-align:left; }
  footer span { display:inline; margin-left:4px; }
}

@media (max-width:400px) {
  .status-pill .status-separator,.status-pill span:last-child{display:none}
  .floating-note{transform:scale(.72)}
  footer span{display:block;margin:2px 0 0}
}

@media (max-width:760px) and (max-height:680px) {
  .site-shell { height:auto; min-height:650px; overflow:hidden; }
  .hero { grid-template-rows:auto 205px; }
}
@media (prefers-reduced-motion:reduce) { *,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important} }
