/* curigo.io — tek sayfalık tanıtım sitesi. Kaynak: site/README.md */

@font-face { font-family: "GoogleSans"; font-weight: 400; font-display: swap; src: url("fonts/GoogleSans-Regular.woff") format("woff"); }
@font-face { font-family: "GoogleSans"; font-weight: 500; font-display: swap; src: url("fonts/GoogleSans-Medium.woff") format("woff"); }
@font-face { font-family: "GoogleSans"; font-weight: 700; font-display: swap; src: url("fonts/GoogleSans-Bold.woff") format("woff"); }

:root {
  --bg: #05070c;
  --panel: rgba(255, 255, 255, 0.035);
  --panel-edge: rgba(255, 255, 255, 0.09);
  --text: #e9edf5;
  --muted: #9ba5b8;
  --link: #79a8f7;
  --green: #009968;
  --amber: #ffc107;
  --red: #d42b38;
  --blue: #1e6ae1;
  --ease-back: cubic-bezier(.34, 1.56, .64, 1);
  --ease-sine: cubic-bezier(.45, 0, .55, 1);
  color-scheme: dark;
}

* { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }

body {
  margin: 0;
  min-height: 100vh;
  color: var(--text);
  font: 400 17px/1.6 "GoogleSans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  background-color: var(--bg);
  background-image:
    radial-gradient(60rem 40rem at 50% -10%, rgba(30, 106, 225, 0.16), transparent 70%),
    radial-gradient(40rem 30rem at 0% 40%, rgba(0, 153, 104, 0.08), transparent 70%),
    radial-gradient(40rem 30rem at 100% 70%, rgba(212, 43, 56, 0.07), transparent 70%),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='420' height='420'%3E%3Cg fill='%23fff'%3E%3Ccircle cx='23' cy='41' r='.8' opacity='.5'/%3E%3Ccircle cx='97' cy='12' r='.6' opacity='.35'/%3E%3Ccircle cx='160' cy='88' r='1' opacity='.45'/%3E%3Ccircle cx='211' cy='30' r='.7' opacity='.3'/%3E%3Ccircle cx='288' cy='64' r='.9' opacity='.5'/%3E%3Ccircle cx='371' cy='22' r='.6' opacity='.4'/%3E%3Ccircle cx='402' cy='131' r='.8' opacity='.35'/%3E%3Ccircle cx='331' cy='170' r='.6' opacity='.45'/%3E%3Ccircle cx='247' cy='149' r='.7' opacity='.3'/%3E%3Ccircle cx='121' cy='176' r='.8' opacity='.4'/%3E%3Ccircle cx='48' cy='133' r='.6' opacity='.35'/%3E%3Ccircle cx='15' cy='232' r='.9' opacity='.45'/%3E%3Ccircle cx='86' cy='271' r='.6' opacity='.3'/%3E%3Ccircle cx='174' cy='248' r='.7' opacity='.5'/%3E%3Ccircle cx='262' cy='293' r='.8' opacity='.35'/%3E%3Ccircle cx='349' cy='252' r='.6' opacity='.4'/%3E%3Ccircle cx='398' cy='318' r='.7' opacity='.3'/%3E%3Ccircle cx='307' cy='371' r='.9' opacity='.45'/%3E%3Ccircle cx='219' cy='398' r='.6' opacity='.35'/%3E%3Ccircle cx='137' cy='352' r='.8' opacity='.4'/%3E%3Ccircle cx='59' cy='389' r='.6' opacity='.3'/%3E%3C/g%3E%3C/svg%3E");
}

a { color: var(--link); text-decoration-thickness: 1px; text-underline-offset: 3px; }
a:hover { color: #a9c7fb; }

.wrap { max-width: 980px; margin: 0 auto; padding: 0 16px; }

/* üst şerit */
.top { display: flex; justify-content: flex-end; padding: 18px 0 0; }
.lang {
  font-size: 14px; color: var(--muted); text-decoration: none;
  border: 1px solid var(--panel-edge); border-radius: 999px; padding: 6px 14px;
  background: var(--panel);
  transition: border-color .4s var(--ease-sine), color .4s var(--ease-sine);
}
.lang:hover { color: var(--text); border-color: rgba(255, 255, 255, 0.22); }

/* giriş: portal + ad */
.hero { text-align: center; padding: 28px 0 56px; }
.portal { position: relative; width: clamp(210px, 56vw, 300px); aspect-ratio: 1; margin: 0 auto 28px; }
.portal::before {
  content: ""; position: absolute; inset: 14%; border-radius: 50%;
  background: conic-gradient(var(--green), var(--blue), var(--red), var(--amber), var(--green));
  filter: blur(44px); opacity: .42;
  animation: spin 21s var(--ease-sine) infinite;
}
.portal img { position: relative; display: block; width: 100%; height: 100%; }

.wordmark {
  margin: 0; font-weight: 700; font-size: clamp(40px, 9vw, 68px); line-height: 1.05;
  letter-spacing: .3em; margin-right: -.3em;
  background: linear-gradient(180deg, #ffffff 0%, #ffffff 45%, #b9c4d8 100%);
  -webkit-background-clip: text; background-clip: text; color: transparent;
}
.tagline { margin: 18px auto 6px; max-width: 30ch; font-weight: 500; font-size: clamp(21px, 3.8vw, 30px); line-height: 1.3; }
.sub { margin: 0 auto; max-width: 46ch; color: var(--muted); }

.soon {
  display: inline-flex; align-items: center; gap: 10px; margin-top: 28px;
  padding: 9px 18px; border-radius: 999px; font-size: 15px; font-weight: 500;
  background: var(--panel); border: 1px solid var(--panel-edge);
}
.dots { display: inline-flex; gap: 4px; }
.dots i { width: 7px; height: 7px; border-radius: 50%; display: block; box-shadow: 0 0 8px currentColor; }
.dots i:nth-child(1) { background: var(--green); color: var(--green); }
.dots i:nth-child(2) { background: var(--amber); color: var(--amber); }
.dots i:nth-child(3) { background: var(--red); color: var(--red); }
.dots i:nth-child(4) { background: var(--blue); color: var(--blue); }

/* bölümler */
section { padding: 8px 0 48px; }
h2 { font-size: 24px; font-weight: 700; margin: 0 0 14px; letter-spacing: .01em; }
.lead { margin: 0; max-width: 64ch; color: #cfd6e3; }

.features { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 16px; margin-top: 26px; }
.card {
  position: relative; overflow: hidden; padding: 22px 20px 20px; border-radius: 18px;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.06), rgba(255, 255, 255, 0.02));
  border: 1px solid var(--panel-edge);
  transition: transform .5s var(--ease-back), border-color .5s var(--ease-sine);
}
.card:hover { transform: translateY(-3px); border-color: rgba(255, 255, 255, 0.18); }
.card::before {
  content: ""; position: absolute; left: 0; right: 0; top: 0; height: 3px;
  background: linear-gradient(90deg, transparent, var(--c), transparent);
}
.card::after {
  content: ""; position: absolute; width: 140px; height: 140px; right: -50px; top: -60px;
  border-radius: 50%; background: var(--c); opacity: .14; filter: blur(30px);
}
.card h3 { margin: 0 0 6px; font-size: 18px; font-weight: 700; }
.card p { margin: 0; color: var(--muted); font-size: 15.5px; }
.c-green { --c: var(--green); }
.c-amber { --c: var(--amber); }
.c-red { --c: var(--red); }
.c-blue { --c: var(--blue); }

.about { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 16px; }
.panel { padding: 22px 20px; border-radius: 18px; background: var(--panel); border: 1px solid var(--panel-edge); }
.panel p { margin: 0 0 10px; }
.panel p:last-child { margin-bottom: 0; }
.label { display: block; font-size: 13px; text-transform: uppercase; letter-spacing: .08em; color: var(--muted); margin-bottom: 2px; }
address { font-style: normal; margin: 0 0 10px; }

footer {
  border-top: 1px solid var(--panel-edge); padding: 20px 0 32px;
  display: flex; flex-wrap: wrap; gap: 8px 20px; justify-content: space-between;
  color: var(--muted); font-size: 14px;
}

@media (max-width: 380px) {
  .soon { white-space: nowrap; font-size: 14px; padding: 9px 15px; gap: 9px; }
}

@keyframes spin { to { transform: rotate(360deg); } }

@media (prefers-reduced-motion: reduce) {
  .portal::before { animation: none; }
  .card, .lang { transition: none; }
}