/* ═══════════════════════════════════════════
   IAMPRO.ONE · Main Stylesheet
   ═══════════════════════════════════════════ */
:root {
    --bg: #05060c;
    --surface: #0a0c16;
    --surface-alt: #0d0f1a;
    --text: #edf2ff;
    --muted: #8793a8;
    --faint: #4a5060;
    --cyan: #84d7ff;
    --gold: #ffd88f;
    --green: #7fffd4;
    --violet: #b79dff;
    --rose: #ff6b81;
    --line: rgba(132,215,255,0.07);
    --line-strong: rgba(132,215,255,0.14);
    --radius: 16px;
    --radius-sm: 10px;
    --ease: 0.28s cubic-bezier(0.4,0,0.2,1);
}
* { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }
body {
    background:var(--bg); color:var(--text);
    font-family:'Inter',system-ui,-apple-system,sans-serif;
    line-height:1.6; -webkit-font-smoothing:antialiased; overflow-x:hidden;
}
.container { max-width:1100px; margin:0 auto; padding:3rem 1.5rem; position:relative; z-index:2; }
.container-sm { max-width:800px; margin:0 auto; padding:2rem 1.5rem; }
h1 { font-size:clamp(2rem,5.5vw,3.4rem); font-weight:600; letter-spacing:-0.025em; line-height:1.12; color:#fff; margin-bottom:0.7rem; }
h2 { font-size:clamp(1.4rem,3vw,1.9rem); font-weight:500; letter-spacing:-0.01em; color:#fff; margin-bottom:0.9rem; }
h3 { font-size:1rem; font-weight:600; color:#fff; margin-bottom:0.4rem; }
.section-label { font-size:0.65rem; letter-spacing:0.18em; text-transform:uppercase; color:var(--gold); margin-bottom:0.4rem; font-weight:500; }
.btn-primary { display:inline-block; background:#fff; color:#05060c; padding:0.8rem 2rem; border-radius:30px; font-weight:600; font-size:0.85rem; letter-spacing:0.01em; text-decoration:none; transition:all 0.25s ease; border:none; cursor:pointer; margin:0.25rem; }
.btn-primary:hover { background:#dcdcdc; transform:translateY(-2px); box-shadow:0 8px 24px rgba(255,255,255,0.12); }
.btn-secondary { display:inline-block; background:transparent; color:var(--cyan); padding:0.8rem 2rem; border-radius:30px; font-weight:500; font-size:0.85rem; letter-spacing:0.01em; text-decoration:none; border:1px solid var(--cyan); transition:all 0.25s ease; cursor:pointer; margin:0.25rem; }
.btn-secondary:hover { background:rgba(132,215,255,0.07); }
.lang-toggle { position:fixed; top:1rem; right:1rem; z-index:100; display:flex; gap:0.3rem; background:rgba(5,6,12,0.85); border:1px solid var(--line-strong); border-radius:25px; padding:0.3rem; backdrop-filter:blur(12px); }
.lang-toggle button { background:transparent; border:none; color:var(--muted); padding:0.35rem 0.9rem; border-radius:20px; cursor:pointer; font-family:inherit; font-size:0.7rem; letter-spacing:0.05em; transition:all 0.25s; }
.lang-toggle button.active { background:rgba(255,255,255,0.08); color:#fff; }
.lang-hidden { display:none !important; }
.hero-wrap { position:relative; min-height:90vh; display:flex; align-items:center; justify-content:center; overflow:hidden; }
.hero-canvas { position:absolute; inset:0; z-index:0; pointer-events:none; }
.hero-content { position:relative; z-index:2; text-align:center; padding:4rem 1.5rem; max-width:780px; }
.hero-content .concrete { font-size:clamp(0.9rem,1.8vw,1.1rem); color:var(--muted); margin:1rem 0 1.8rem; line-height:1.5; }
.hero-badge-row { display:flex; flex-wrap:wrap; gap:0.6rem; justify-content:center; margin-top:1.5rem; }
.hero-badge { background:rgba(255,255,255,0.03); border:1px solid var(--line); padding:0.35rem 1rem; border-radius:20px; font-size:0.7rem; color:var(--muted); letter-spacing:0.03em; }
.continuity-block { background:var(--surface-alt); border:1px solid var(--line-strong); border-radius:var(--radius); padding:2.5rem 2rem; text-align:center; margin:2rem 0; position:relative; overflow:hidden; }
.continuity-block::before { content:''; position:absolute; inset:0; background:radial-gradient(ellipse at 50% 30%, rgba(183,157,255,0.04), transparent 60%); pointer-events:none; }
.continuity-block .big-question { font-family:'Georgia','Palatino Linotype',serif; font-size:clamp(1rem,2vw,1.3rem); color:var(--text); font-style:italic; line-height:1.6; position:relative; z-index:1; }
.continuity-block .reveal { font-family:'Georgia','Palatino Linotype',serif; font-size:clamp(1.2rem,2.5vw,1.6rem); color:var(--gold); margin-top:1rem; font-weight:600; position:relative; z-index:1; }
.continuity-block .sub-reveal { font-size:0.85rem; color:var(--muted); margin-top:0.8rem; position:relative; z-index:1; max-width:550px; margin-left:auto; margin-right:auto; }
.signature-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); gap:1.5rem; margin-top:2rem; }
.signature-card { background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; transition:all 0.35s ease; display:flex; flex-direction:column; }
.signature-card:hover { border-color:var(--cyan); transform:translateY(-4px); box-shadow:0 20px 48px rgba(0,0,0,0.55); }
.sig-card-header { padding:1.5rem 1.5rem 0.8rem; }
.sig-card-header .sig-icon { font-size:2.2rem; margin-bottom:0.5rem; display:block; }
.sig-card-header h3 { font-size:1.15rem; margin-bottom:0.2rem; }
.sig-card-header .sig-type { font-size:0.6rem; letter-spacing:0.14em; color:var(--violet); text-transform:uppercase; }
.sig-card-body { padding:0 1.5rem 1.2rem; flex:1; }
.sig-card-body .before-after { font-size:0.78rem; color:var(--muted); line-height:1.55; margin-bottom:0.8rem; }
.sig-card-body .before-after .bf-before { color:var(--rose); font-weight:500; }
.sig-card-body .before-after .bf-after { color:var(--green); font-weight:500; }
.sig-card-footer { padding:0.8rem 1.5rem 1.5rem; display:flex; gap:0.5rem; flex-wrap:wrap; }
.sig-card-footer a, .sig-card-footer button { font-size:0.66rem; padding:0.35rem 1rem; border-radius:18px; background:transparent; border:1px solid var(--faint); color:#bbb; cursor:pointer; text-decoration:none; transition:all 0.2s; font-family:inherit; letter-spacing:0.02em; }
.sig-card-footer a:hover, .sig-card-footer button:hover { border-color:#fff; color:#fff; }
.commercial-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:1rem; margin-top:1.5rem; }
.commercial-card { background:var(--surface); border:1px solid var(--line); border-radius:var(--radius-sm); padding:1.3rem; transition:all 0.3s; }
.commercial-card:hover { border-color:var(--cyan); transform:translateY(-2px); }
.commercial-card .cc-name { font-weight:600; font-size:0.9rem; margin-bottom:0.2rem; }
.commercial-card .cc-desc { font-size:0.7rem; color:var(--muted); margin-bottom:0.6rem; }
.commercial-card .cc-actions { display:flex; gap:0.4rem; }
.commercial-card .cc-actions a, .commercial-card .cc-actions button { font-size:0.6rem; padding:0.25rem 0.7rem; border-radius:15px; background:transparent; border:1px solid var(--faint); color:#bbb; cursor:pointer; text-decoration:none; transition:all 0.2s; font-family:inherit; }
.commercial-card .cc-actions a:hover, .commercial-card .cc-actions button:hover { border-color:#fff; color:#fff; }
.experimental-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:0.8rem; margin-top:1rem; }
.experimental-chip { background:var(--surface); border:1px solid var(--line); border-radius:25px; padding:0.5rem 1.2rem; text-align:center; font-size:0.7rem; color:var(--muted); cursor:pointer; transition:all 0.25s; text-decoration:none; display:block; letter-spacing:0.03em; }
.experimental-chip:hover { border-color:var(--violet); color:var(--violet); background:rgba(183,157,255,0.04); }
.evidence-gallery { display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:1rem; margin-top:1.5rem; }
.evidence-item { background:var(--surface); border:1px solid var(--line); border-radius:var(--radius-sm); padding:1.2rem; text-align:center; transition:all 0.3s; }
.evidence-item:hover { border-color:var(--cyan); transform:translateY(-3px); }
.evidence-item .ev-icon { font-size:1.8rem; margin-bottom:0.4rem; }
.evidence-item .ev-title { font-weight:600; font-size:0.85rem; color:#fff; margin-bottom:0.2rem; }
.evidence-item .ev-outcome { font-size:0.7rem; color:var(--green); }
.pricing-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:1rem; margin-top:1.5rem; }
.pricing-card { background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); padding:1.5rem; text-align:center; transition:all 0.3s; }
.pricing-card:hover { border-color:var(--line-strong); transform:translateY(-3px); }
.pricing-card .tier { font-size:0.65rem; letter-spacing:0.12em; color:var(--gold); text-transform:uppercase; margin-bottom:0.4rem; }
.pricing-card .price { font-size:1.8rem; font-weight:700; color:#fff; margin-bottom:0.2rem; }
.pricing-card .price-note { font-size:0.6rem; color:var(--muted); margin-bottom:0.6rem; }
.pricing-card .who-for { font-size:0.62rem; color:var(--cyan); margin-bottom:0.6rem; font-style:italic; }
.pricing-card ul { list-style:none; font-size:0.7rem; color:var(--muted); line-height:1.8; text-align:left; }
.pricing-card ul li::before { content:'✓ '; color:var(--green); }
.steps-row { display:flex; flex-wrap:wrap; justify-content:center; gap:1.2rem; margin:2rem 0; }
.step-card { flex:1 1 160px; max-width:200px; text-align:center; padding:1.3rem 1rem; background:var(--surface); border-radius:var(--radius); border:1px solid var(--line); }
.step-card .step-num { font-size:1.7rem; font-weight:700; color:var(--gold); display:block; margin-bottom:0.2rem; }
.step-card strong { font-size:0.8rem; color:#fff; }
.step-card p { font-size:0.68rem; color:var(--muted); margin-top:0.3rem; }
.bridge-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(160px,1fr)); gap:0.8rem; margin:1.5rem 0; }
.bridge-option { background:var(--surface); border:1px solid var(--line); border-radius:var(--radius-sm); padding:1rem; text-align:center; cursor:pointer; transition:all 0.25s; }
.bridge-option:hover { border-color:var(--cyan); background:rgba(132,215,255,0.03); }
.bridge-option .bo-icon { font-size:1.5rem; display:block; margin-bottom:0.3rem; }
.bridge-option .bo-label { font-size:0.75rem; color:var(--text); }
.form-panel { max-width:480px; margin:0 auto; background:var(--surface); border:1px solid var(--line-strong); border-radius:var(--radius); padding:2rem; }
.form-panel input, .form-panel select, .form-panel textarea { width:100%; padding:0.75rem 1rem; margin:0.4rem 0; background:rgba(255,255,255,0.025); border:1px solid var(--line); border-radius:8px; color:#fff; font-family:inherit; font-size:0.8rem; outline:none; }
.form-panel input:focus, .form-panel select:focus, .form-panel textarea:focus { border-color:var(--cyan); }
.search-box { background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); padding:1.5rem; text-align:center; }
.search-input { width:100%; max-width:400px; padding:0.7rem 1.2rem; border-radius:30px; background:rgba(255,255,255,0.03); border:1px solid var(--line); color:#fff; font-size:0.8rem; outline:none; margin:0.8rem auto; display:block; font-family:inherit; }
.search-input:focus { border-color:var(--cyan); }
.results-drop { text-align:left; max-width:450px; margin:0 auto; display:none; background:rgba(8,12,22,0.95); border:1px solid var(--line); border-radius:var(--radius); padding:0.6rem; max-height:280px; overflow-y:auto; backdrop-filter:blur(12px); }
.results-drop.open { display:block; }
.result-row { display:flex; align-items:center; gap:0.5rem; padding:0.5rem 0.6rem; border-bottom:1px solid rgba(255,255,255,0.02); cursor:pointer; color:var(--text); font-size:0.75rem; transition:background 0.15s; border-radius:8px; }
.result-row:hover { background:rgba(255,255,255,0.03); }
.result-row .res-icon { font-size:1rem; flex-shrink:0; }
.result-row .res-info { flex:1; min-width:0; }
.result-row .res-info .res-title { font-weight:500; color:var(--text); }
.result-row .res-info .res-url { font-size:0.6rem; color:var(--muted); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.result-row .res-preview-btn { background:none; border:1px solid var(--line); color:var(--muted); padding:0.2rem 0.5rem; border-radius:5px; cursor:pointer; font-size:0.6rem; transition:all 0.2s; flex-shrink:0; }
.result-row .res-preview-btn:hover { border-color:var(--gold); color:var(--gold); }
.result-row.external { opacity:0.6; }
/* Preview modal */
.preview-modal { display:none; position:fixed; inset:0; z-index:9999; background:rgba(0,0,0,0.9); backdrop-filter:blur(12px); flex-direction:column; }
.preview-modal.open { display:flex; }
.preview-toolbar { display:flex; justify-content:space-between; align-items:center; padding:0.5rem 1rem; background:var(--bg); border-bottom:1px solid var(--line); }
.preview-toolbar span { color:var(--muted); font-size:0.7rem; flex:1; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.preview-toolbar button { background:transparent; border:1px solid var(--line); color:var(--text); padding:0.25rem 0.6rem; border-radius:5px; cursor:pointer; font-size:0.65rem; margin-left:0.3rem; transition:all 0.2s; }
.preview-toolbar button:hover { border-color:var(--gold); color:var(--gold); }
.preview-frame { flex:1; border:none; width:100%; background:#fff; }
footer { text-align:center; color:var(--faint); font-size:0.65rem; padding:2rem 1rem; border-top:1px solid var(--line); margin-top:2rem; }
footer a { color:var(--muted); text-decoration:none; }
footer a:hover { color:var(--cyan); }
@media (max-width:600px) {
    .signature-grid { grid-template-columns:1fr; }
    .commercial-grid { grid-template-columns:1fr; }
    .bridge-grid { grid-template-columns:1fr 1fr; }
    .lang-toggle { top:0.5rem; right:0.5rem; }
}