/* Web7 modern inner pages */
.inner-page {
    --inner-card: rgba(255,255,255,.72);
    --inner-card-strong: rgba(255,255,255,.9);
    --inner-soft: rgba(109,54,242,.065);
    --inner-shadow: 0 24px 70px rgba(49,20,91,.11);
}
.dark .inner-page {
    --inner-card: rgba(255,255,255,.035);
    --inner-card-strong: rgba(19,4,32,.94);
    --inner-soft: rgba(132,82,255,.09);
    --inner-shadow: 0 28px 80px rgba(0,0,0,.28);
}

.inner-hero {
    position: relative;
    overflow: hidden;
    isolation: isolate;
    border-bottom: 1px solid var(--web7-line);
    background:
        radial-gradient(circle at 82% 22%, rgba(126,74,255,.17), transparent 25%),
        radial-gradient(circle at 11% 85%, rgba(49,104,255,.09), transparent 26%),
        linear-gradient(125deg, #fbfaff 0%, #f5f1ff 52%, #eee5ff 100%);
}
.dark .inner-hero {
    background:
        radial-gradient(circle at 82% 22%, rgba(112,55,230,.18), transparent 27%),
        radial-gradient(circle at 11% 85%, rgba(55,70,190,.10), transparent 28%),
        linear-gradient(125deg, #090011 0%, #0e001c 54%, #17072a 100%);
}
.inner-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -2;
    background-image: linear-gradient(rgba(91,55,150,.05) 1px, transparent 1px), linear-gradient(90deg, rgba(91,55,150,.05) 1px, transparent 1px);
    background-size: 56px 56px;
    mask-image: linear-gradient(to right, transparent, #000 32%, #000);
}
.dark .inner-hero::before { opacity: .28; }
.inner-hero::after {
    content: "";
    position: absolute;
    width: 440px;
    height: 440px;
    right: -130px;
    top: -190px;
    border: 1px solid rgba(117,67,228,.18);
    border-radius: 43% 57% 52% 48% / 48% 38% 62% 52%;
    transform: rotate(18deg);
    box-shadow: inset 0 0 80px rgba(109,54,242,.06);
    z-index: -1;
}
.inner-hero-grid {
    max-width: 1280px;
    margin: 0 auto;
    padding: clamp(4.5rem, 8vw, 7rem) 1rem;
    display: grid;
    grid-template-columns: minmax(0, 1.08fr) minmax(390px, .92fr);
    gap: clamp(2.5rem, 6vw, 6rem);
    align-items: center;
}
.inner-kicker {
    display: inline-flex;
    align-items: center;
    gap: .6rem;
    font-size: .72rem;
    letter-spacing: .18em;
    font-weight: 800;
    text-transform: uppercase;
    color: #6d36f2;
}
.dark .inner-kicker { color: #c9acff; }
.inner-kicker::before {
    content: "";
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: linear-gradient(135deg, #3168ff, #9b4bff);
    box-shadow: 0 0 16px rgba(120,65,240,.55);
}
.inner-title {
    margin-top: 1.15rem;
    max-width: 830px;
    font-size: clamp(3rem, 5.5vw, 5.2rem);
    line-height: 1.01;
    font-weight: 800;
    letter-spacing: -.065em;
}
.inner-copy {
    margin-top: 1.5rem;
    max-width: 700px;
    font-size: clamp(1rem, 1.45vw, 1.12rem);
    line-height: 1.85;
    color: var(--web7-muted);
}
.inner-gradient-text {
    background: linear-gradient(92deg, #3168ff 0%, #7143f7 50%, #a54dff 100%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

.inner-console {
    position: relative;
    border-radius: 28px;
    border: 1px solid rgba(114,71,205,.14);
    background: var(--inner-card-strong);
    box-shadow: var(--inner-shadow);
    overflow: hidden;
    backdrop-filter: blur(18px);
}
.dark .inner-console { border-color: rgba(179,145,255,.15); }
.inner-console-head {
    height: 46px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 16px;
    border-bottom: 1px solid var(--web7-line);
    font: 700 11px/1.2 ui-monospace, SFMono-Regular, Menlo, monospace;
    color: var(--web7-muted);
}
.console-dots { display:flex; gap:6px; }
.console-dots span { width:8px; height:8px; border-radius:50%; background:#d7cdeb; }
.console-dots span:nth-child(1){background:#ff6b80}.console-dots span:nth-child(2){background:#f7c25c}.console-dots span:nth-child(3){background:#62d394}
.inner-console-body { padding: 20px; }
.inner-console-line {
    display:flex;
    align-items:center;
    gap:12px;
    min-height:48px;
    padding: 10px 12px;
    border-radius:14px;
    transition: background .25s ease, transform .25s ease;
}
.inner-console-line:hover { background: var(--inner-soft); transform: translateX(4px); }
.inner-console-code { font: 700 12px/1.5 ui-monospace, SFMono-Regular, Menlo, monospace; color:#7040e7; }
.dark .inner-console-code { color:#bd9dff; }
.inner-console-note { margin-left:auto; font-size:11px; color:var(--web7-muted); }

.inner-section { padding: clamp(4.5rem, 7vw, 6.5rem) 1rem; }
.inner-wrap { max-width:1280px; margin:0 auto; }
.inner-section-soft {
    border-block: 1px solid var(--web7-line);
    background: linear-gradient(180deg, rgba(109,54,242,.035), rgba(49,104,255,.025));
}
.dark .inner-section-soft { background: rgba(255,255,255,.012); }
.section-heading { max-width:760px; }
.section-heading h2 { margin-top:.7rem; font-size:clamp(2.2rem,4vw,3.6rem); line-height:1.04; letter-spacing:-.055em; font-weight:800; }
.section-heading p { margin-top:1rem; color:var(--web7-muted); line-height:1.8; }

.modern-card {
    position:relative;
    border:1px solid var(--web7-line);
    background:var(--inner-card);
    box-shadow: 0 16px 46px rgba(53,28,100,.055);
    backdrop-filter:blur(14px);
    transition: border-color .28s ease, box-shadow .28s ease, transform .28s ease;
    transform-style: preserve-3d;
}
.dark .modern-card { box-shadow: 0 20px 54px rgba(0,0,0,.12); }
.modern-card:hover { border-color: rgba(117,67,228,.3); box-shadow: var(--inner-shadow); }
.modern-card::after {
    content:"";
    position:absolute;
    inset:0;
    border-radius:inherit;
    pointer-events:none;
    background:radial-gradient(circle at var(--card-x,50%) var(--card-y,50%), rgba(121,70,244,.11), transparent 33%);
    opacity:0;
    transition:opacity .25s ease;
}
.modern-card:hover::after { opacity:1; }

.service-modern-grid { display:grid; grid-template-columns:repeat(12,minmax(0,1fr)); gap:16px; margin-top:2.5rem; }
.service-modern-card { grid-column:span 6; min-height:300px; padding:28px; border-radius:28px; overflow:hidden; }
.service-modern-card:nth-child(1), .service-modern-card:nth-child(4){grid-column:span 7}.service-modern-card:nth-child(2), .service-modern-card:nth-child(5){grid-column:span 5}
.service-modern-card:nth-child(3){grid-column:span 12; min-height:250px}
.service-number { font:800 11px/1 ui-monospace,monospace; color:var(--web7-muted); }
.service-modern-icon { width:54px; height:54px; border-radius:16px; display:grid; place-items:center; background:linear-gradient(135deg, rgba(49,104,255,.12), rgba(141,67,255,.15)); color:#6d36f2; }
.dark .service-modern-icon{color:#c7a8ff}
.service-modern-card h3 { margin-top:30px; font-size:clamp(1.45rem,2.5vw,2rem); letter-spacing:-.04em; font-weight:800; }
.service-modern-card p { margin-top:10px; max-width:620px; color:var(--web7-muted); line-height:1.75; font-size:.9rem; }
.feature-chip { display:inline-flex; align-items:center; gap:7px; padding:8px 11px; border:1px solid var(--web7-line); border-radius:999px; font-size:11px; font-weight:700; background:rgba(255,255,255,.42); }
.dark .feature-chip{background:rgba(255,255,255,.025)}
.service-card-arrow { position:absolute; right:24px; top:24px; width:40px; height:40px; display:grid; place-items:center; border:1px solid var(--web7-line); border-radius:50%; transition:transform .3s ease, background .3s ease; }
.service-modern-card:hover .service-card-arrow { transform:rotate(-35deg); background:#6d36f2; color:#fff; }

.process-line { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; margin-top:2.5rem; }
.process-step { padding:24px; border-radius:24px; }
.process-step-index { font:800 11px/1 ui-monospace,monospace; color:#7040e7; }
.dark .process-step-index{color:#c0a0ff}
.process-step h3{margin-top:28px;font-size:1.1rem;font-weight:800}.process-step p{margin-top:8px;font-size:.82rem;line-height:1.7;color:var(--web7-muted)}

.project-grid-modern { display:grid; grid-template-columns:repeat(12,minmax(0,1fr)); gap:18px; margin-top:2.5rem; }
.project-card-modern { grid-column:span 6; border-radius:30px; overflow:hidden; }
.project-card-modern:nth-child(3n+1){grid-column:span 7}.project-card-modern:nth-child(3n+2){grid-column:span 5}.project-card-modern:nth-child(3n+3){grid-column:span 12}
.project-preview { position:relative; min-height:310px; padding:24px; overflow:hidden; background:linear-gradient(145deg, rgba(109,54,242,.16), rgba(49,104,255,.08)); }
.project-preview::before { content:""; position:absolute; width:260px; height:260px; right:-70px; top:-80px; border:1px solid rgba(119,70,225,.2); border-radius:48% 52% 44% 56%/43% 54% 46% 57%; transform:rotate(22deg); }
.project-ui { position:absolute; inset:50px 28px 26px 28px; border:1px solid rgba(255,255,255,.32); border-radius:20px; padding:15px; background:rgba(255,255,255,.63); box-shadow:0 20px 60px rgba(57,30,112,.14); backdrop-filter:blur(10px); }
.dark .project-ui { background:rgba(10,2,19,.62); border-color:rgba(255,255,255,.10); }
.project-ui-top { height:9px; width:42%; border-radius:999px; background:linear-gradient(90deg,#3168ff,#8b42ff); }
.project-ui-grid { display:grid; grid-template-columns:1.15fr .85fr; gap:10px; height:calc(100% - 26px); margin-top:16px; }
.project-ui-block { border-radius:12px; background:rgba(109,54,242,.09); border:1px solid rgba(109,54,242,.08); }
.project-ui-stack { display:grid; gap:10px; grid-template-rows:1fr 1fr; }
.project-info { padding:26px; }
.project-info h2 { margin-top:8px; font-size:1.6rem; letter-spacing:-.04em; font-weight:800; }
.project-info p { margin-top:10px; color:var(--web7-muted); font-size:.88rem; line-height:1.75; }

.filter-bar { display:flex; flex-wrap:wrap; gap:8px; margin-top:2rem; }
.filter-modern { position:relative; overflow:hidden; border:1px solid var(--web7-line); border-radius:999px; padding:10px 15px; font-size:11px; font-weight:800; transition:.25s ease; }
.filter-modern:hover { border-color:rgba(109,54,242,.3); color:#6d36f2; }
.filter-modern.is-selected, .filter-modern.bg-violet-600 { background:linear-gradient(105deg,#3168ff,#7e43f6); color:#fff; border-color:transparent; box-shadow:0 10px 24px rgba(91,56,205,.18); }

.about-bento { display:grid; grid-template-columns:1.15fr .85fr; gap:18px; margin-top:2.7rem; }
.about-panel { border-radius:28px; padding:28px; }
.about-stat-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:12px; }
.about-stat { padding:20px; border:1px solid var(--web7-line); border-radius:20px; }
.about-stat strong { display:block; font-size:1.15rem; }.about-stat span{display:block;margin-top:5px;font-size:.75rem;color:var(--web7-muted)}
.director-modern { display:grid; grid-template-columns:minmax(300px,.78fr) minmax(0,1.22fr); gap:44px; align-items:center; }
.director-image-card { position:relative; padding:8px; border-radius:30px; background:linear-gradient(135deg,rgba(49,104,255,.17),rgba(142,67,255,.2)); box-shadow:var(--inner-shadow); }
.director-image-card img { width:100%; aspect-ratio:4/5; object-fit:cover; object-position:top; border-radius:24px; display:block; }
.director-badge { position:absolute; left:24px; bottom:24px; border:1px solid rgba(255,255,255,.18); background:rgba(12,2,23,.68); color:white; padding:12px 16px; border-radius:14px; backdrop-filter:blur(12px); }

.contact-layout { display:grid; grid-template-columns:.72fr 1.28fr; gap:24px; align-items:start; }
.contact-card { border-radius:24px; padding:22px; display:flex; align-items:center; gap:14px; }
.contact-symbol { width:44px; height:44px; border-radius:14px; display:grid; place-items:center; background:linear-gradient(135deg,rgba(49,104,255,.12),rgba(142,67,255,.16)); color:#6d36f2; flex:0 0 auto; }
.dark .contact-symbol{color:#c5a6ff}
.contact-form-modern { border-radius:30px; padding:clamp(22px,4vw,36px); }
.contact-form-modern input,.contact-form-modern select,.contact-form-modern textarea { width:100%; border:1px solid var(--web7-line); background:rgba(255,255,255,.62); border-radius:14px; padding:13px 14px; outline:none; transition:border-color .25s ease,box-shadow .25s ease,background .25s ease; }
.dark .contact-form-modern input,.dark .contact-form-modern select,.dark .contact-form-modern textarea { background:rgba(255,255,255,.035); color:inherit; }
.contact-form-modern input:focus,.contact-form-modern select:focus,.contact-form-modern textarea:focus { border-color:rgba(109,54,242,.55); box-shadow:0 0 0 4px rgba(109,54,242,.07); }

.service-show-visual { min-height:440px; position:relative; }
.service-show-core { position:absolute; left:50%; top:50%; width:130px; height:130px; transform:translate(-50%,-50%); display:grid; place-items:center; border-radius:36px; color:#fff; background:linear-gradient(135deg,#3168ff,#7b43f5 58%,#a048ff); box-shadow:0 25px 70px rgba(90,50,210,.32); z-index:5; }
.service-show-orbit { position:absolute; border:1px solid rgba(117,67,228,.25); border-radius:50%; left:50%; top:50%; transform:translate(-50%,-50%) rotate(var(--r,0deg)); }
.service-show-orbit.o1{width:340px;height:220px;--r:18deg}.service-show-orbit.o2{width:410px;height:300px;--r:-21deg}.service-show-orbit.o3{width:260px;height:390px;--r:34deg}
.service-show-dot { position:absolute; width:28px; height:28px; border-radius:10px; background:linear-gradient(135deg,#8b57ff,#4a21b7); box-shadow:0 12px 32px rgba(97,49,210,.3); }
.service-show-dot.d1{left:18%;top:22%}.service-show-dot.d2{right:12%;top:33%;width:40px;height:40px;border-radius:14px}.service-show-dot.d3{left:30%;bottom:13%;width:22px;height:22px}
.capability-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:12px; }
.capability-item { border-radius:18px; padding:18px; display:flex; gap:12px; align-items:center; }
.capability-check { width:32px;height:32px;display:grid;place-items:center;border-radius:10px;background:linear-gradient(135deg,rgba(49,104,255,.12),rgba(140,67,255,.17));color:#6d36f2;font-weight:900; }
.dark .capability-check{color:#c3a2ff}
.service-process { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin-top:2.5rem; }

.page-reveal { opacity:0; transform:translateY(22px); transition:opacity .7s cubic-bezier(.2,.7,.2,1), transform .7s cubic-bezier(.2,.7,.2,1); }
.page-reveal.is-visible { opacity:1; transform:none; }

@media(max-width:1024px){
    .inner-hero-grid{grid-template-columns:1fr}.inner-console{max-width:680px}.service-modern-card,.service-modern-card:nth-child(n){grid-column:span 6}.project-card-modern,.project-card-modern:nth-child(n){grid-column:span 6}.about-bento,.director-modern,.contact-layout{grid-template-columns:1fr}.director-image-card{max-width:500px}.process-line{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:700px){
    .inner-hero-grid{padding:4rem 1rem}.inner-title{font-size:clamp(2.7rem,13vw,4rem)}.service-modern-card,.service-modern-card:nth-child(n),.project-card-modern,.project-card-modern:nth-child(n){grid-column:span 12}.service-modern-grid,.project-grid-modern{gap:12px}.process-line,.service-process,.capability-grid{grid-template-columns:1fr}.about-stat-grid{grid-template-columns:1fr}.project-preview{min-height:250px}.service-show-visual{min-height:340px}.service-show-orbit.o1{width:270px;height:180px}.service-show-orbit.o2{width:320px;height:235px}.service-show-orbit.o3{width:210px;height:310px}}
@media(prefers-reduced-motion:reduce){.page-reveal{opacity:1;transform:none;transition:none}.modern-card{transform:none!important}}
