/* Cyphonica Site - components.css */

/* Buttons */
.cy-btn{
	display:inline-flex;align-items:center;justify-content:center;
	padding:.75em 1.4em;border-radius:var(--cy-radius-md);
	font-weight:600;font-size:.95rem;line-height:1;border:1px solid transparent;
	transition:transform .15s ease, background .2s ease, border-color .2s ease, color .2s ease;
	text-decoration:none;cursor:pointer;
}
.cy-btn:hover{transform:translateY(-1px);text-decoration:none}
.cy-btn--accent{background:var(--cy-accent-2);color:#1a1606;border-color:var(--cy-accent-2)}
.cy-btn--accent:hover{background:#ffd57a;border-color:#ffd57a;color:#1a1606}
.cy-btn--ghost{background:transparent;color:var(--cy-text);border-color:var(--cy-line-strong)}
.cy-btn--ghost:hover{border-color:var(--cy-accent);color:var(--cy-accent)}
.cy-btn--lg{padding:.95em 1.6em;font-size:1rem}

.cy-link{display:inline-flex;align-items:center;gap:.4em;color:var(--cy-accent);font-weight:600}
.cy-link:hover{text-decoration:underline}

/* Nav */
.cy-nav{
	position:sticky;top:0;z-index:50;
	background:rgba(11,18,32,.85);
	backdrop-filter:saturate(160%) blur(12px);
	-webkit-backdrop-filter:saturate(160%) blur(12px);
	border-bottom:1px solid var(--cy-line);
}
.cy-nav__inner{max-width:var(--cy-grid-max);margin:0 auto;padding:.85em var(--cy-gutter);display:flex;align-items:center;gap:1.5em}
.cy-nav__brand{display:flex;align-items:center;gap:.55em;color:var(--cy-text);font-weight:700;font-family:var(--cy-font-display);font-size:1.05rem;letter-spacing:.01em}
.cy-nav__brand:hover{text-decoration:none;color:var(--cy-text)}
.cy-nav__logo{color:var(--cy-accent);display:inline-flex}
.cy-nav__list{display:flex;align-items:center;gap:1.6em;margin-left:auto}
.cy-nav__list ul{list-style:none;padding:0;margin:0;display:flex;gap:1.4em}
.cy-nav__list a{color:var(--cy-text-soft);font-weight:500;font-size:.95rem}
.cy-nav__list a:hover{color:var(--cy-text);text-decoration:none}
.cy-nav__list a[aria-current="page"]{color:var(--cy-accent)}
.cy-nav__cta{margin-left:.6em}
.cy-nav__toggle{display:none;background:none;border:0;width:40px;height:40px;margin-left:auto;flex-direction:column;justify-content:center;gap:5px;align-items:center}
.cy-nav__toggle span{width:22px;height:2px;background:var(--cy-text);display:block;transition:transform .2s, opacity .2s}
.cy-nav.is-open .cy-nav__toggle span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.cy-nav.is-open .cy-nav__toggle span:nth-child(2){opacity:0}
.cy-nav.is-open .cy-nav__toggle span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

@media (max-width:880px){
	.cy-nav__toggle{display:flex}
	.cy-nav__list{
		display:none;position:absolute;top:100%;left:0;right:0;
		background:var(--cy-bg-elev);border-bottom:1px solid var(--cy-line);
		flex-direction:column;align-items:stretch;gap:0;padding:.6em var(--cy-gutter) 1em;
	}
	.cy-nav.is-open .cy-nav__list{display:flex}
	.cy-nav__list ul{flex-direction:column;gap:0;width:100%}
	.cy-nav__list ul li{border-bottom:1px solid var(--cy-line)}
	.cy-nav__list ul a{display:block;padding:.9em 0}
	.cy-nav__cta{margin-top:.8em;align-self:flex-start}
}

/* Hero */
.cy-hero{
	position:relative;padding:clamp(4rem,10vh,7rem) 0 clamp(3rem,8vh,5rem);
	background:
		radial-gradient(1200px 500px at 80% -10%, rgba(91,227,200,.10), transparent 60%),
		radial-gradient(900px 400px at 0% 110%, rgba(255,200,87,.07), transparent 60%),
		linear-gradient(180deg, var(--cy-bg) 0%, var(--cy-bg-elev) 100%);
	border-bottom:1px solid var(--cy-line);
	overflow:hidden;
}
.cy-hero__title{max-width:22ch}
.cy-hero__sub{max-width:60ch;color:var(--cy-text-soft);font-size:1.15rem;margin-bottom:1.6em}
.cy-hero__cta{display:flex;gap:.8em;flex-wrap:wrap;margin-bottom:2.4em}
.cy-hero__trust{color:var(--cy-text-muted);font-size:.92rem}

.cy-page-hero{
	padding:clamp(3rem,7vh,5rem) 0 clamp(2rem,5vh,3rem);
	background:linear-gradient(180deg, var(--cy-bg-elev) 0%, var(--cy-bg) 100%);
	border-bottom:1px solid var(--cy-line);
}
.cy-page-hero h1{max-width:24ch}

/* Sections */
.cy-section{padding:clamp(3rem,8vh,5rem) 0}
.cy-section--surface{background:var(--cy-bg-elev);border-block:1px solid var(--cy-line)}
.cy-section--anchor{padding-block:clamp(3rem,7vh,4rem)}
.cy-section__head{margin-bottom:2.4em;max-width:60ch}

/* Anchor (Copilot block on home) */
.cy-anchor{display:grid;grid-template-columns:1.4fr 1fr;gap:clamp(1.5em,4vw,3em);align-items:start}
@media (max-width:820px){.cy-anchor{grid-template-columns:1fr}}

/* Cards */
.cy-card{background:var(--cy-surface);border:1px solid var(--cy-line);border-radius:var(--cy-radius-lg);padding:1.6em;box-shadow:var(--cy-shadow-1)}
.cy-card--quiet{background:rgba(22,34,61,.6)}
.cy-checklist{list-style:none;padding:0;margin:0;display:grid;gap:.55em}
.cy-checklist li{padding-left:1.6em;position:relative;color:var(--cy-text-soft);font-size:.95rem}
.cy-checklist li::before{content:"";position:absolute;left:0;top:.45em;width:14px;height:14px;border-radius:50%;background:rgba(91,227,200,.15);border:1px solid var(--cy-accent)}
.cy-checklist li::after{content:"";position:absolute;left:4px;top:.65em;width:6px;height:6px;border-radius:50%;background:var(--cy-accent)}

/* Pillars on home */
.cy-pillars{display:grid;grid-template-columns:repeat(3,1fr);gap:1.4em}
@media (max-width:980px){.cy-pillars{grid-template-columns:repeat(2,1fr)}}
@media (max-width:620px){.cy-pillars{grid-template-columns:1fr}}
.cy-pillar{background:var(--cy-surface);border:1px solid var(--cy-line);border-radius:var(--cy-radius-lg);padding:1.6em;display:flex;flex-direction:column;gap:.6em}
.cy-pillar h3{margin:0}
.cy-pillar p{color:var(--cy-text-soft);font-size:.97rem;margin:0}
.cy-pillar .cy-link{margin-top:auto;padding-top:.4em}

/* Stats */
.cy-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:1.4em;text-align:center}
@media (max-width:780px){.cy-stats{grid-template-columns:repeat(2,1fr)}}
.cy-stat{padding:1.4em 1em;border:1px solid var(--cy-line);border-radius:var(--cy-radius-md);background:var(--cy-surface)}
.cy-stat__num{display:block;font-family:var(--cy-font-display);font-size:2.2rem;font-weight:700;color:var(--cy-accent);letter-spacing:-0.02em}
.cy-stat__label{display:block;color:var(--cy-text-muted);font-size:.88rem;margin-top:.4em}

/* Process */
.cy-process{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(5,1fr);gap:1em;counter-reset:step}
@media (max-width:980px){.cy-process{grid-template-columns:repeat(2,1fr)}}
@media (max-width:520px){.cy-process{grid-template-columns:1fr}}
.cy-process li{background:var(--cy-surface);border:1px solid var(--cy-line);border-radius:var(--cy-radius-md);padding:1.2em}
.cy-process li>span{display:inline-block;color:var(--cy-accent);font-weight:700;font-family:var(--cy-font-mono);font-size:.85rem;margin-bottom:.6em}
.cy-process h3{margin:0 0 .3em;font-size:1.05rem}
.cy-process p{margin:0;color:var(--cy-text-soft);font-size:.92rem}

/* Two col layout */
.cy-two-col{display:grid;grid-template-columns:1fr 1fr;gap:clamp(1.5em,4vw,3em);align-items:start}
@media (max-width:780px){.cy-two-col{grid-template-columns:1fr}}

/* Bullets */
.cy-bullets{list-style:none;padding:0;margin:0;display:grid;gap:.6em}
.cy-bullets li{padding-left:1.6em;position:relative;color:var(--cy-text-soft)}
.cy-bullets li::before{content:"";position:absolute;left:0;top:.55em;width:8px;height:8px;border-radius:50%;background:var(--cy-accent)}
.cy-numbered{padding-left:1.4em;color:var(--cy-text-soft)}
.cy-numbered li{margin:.5em 0}
.cy-callout{background:var(--cy-surface);border-left:3px solid var(--cy-accent);padding:1em 1.2em;border-radius:var(--cy-radius-sm);color:var(--cy-text)}

/* Services grid */
.cy-services-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1.4em}
@media (max-width:780px){.cy-services-grid{grid-template-columns:1fr}}
.cy-service-card{display:block;background:var(--cy-surface);border:1px solid var(--cy-line);border-radius:var(--cy-radius-lg);padding:1.8em;color:var(--cy-text);transition:border-color .2s, transform .2s}
.cy-service-card:hover{border-color:var(--cy-accent);transform:translateY(-2px);text-decoration:none}
.cy-service-card h2{font-size:1.3rem;margin:0 0 .4em}
.cy-service-card__tag{color:var(--cy-text);margin-bottom:.6em}
.cy-service-card__outcome{color:var(--cy-text-soft);font-size:.95rem;margin-bottom:1em}

/* CTA band */
.cy-cta-band{background:linear-gradient(135deg, var(--cy-surface) 0%, var(--cy-bg-elev) 100%);border-block:1px solid var(--cy-line);padding:clamp(2.5em,6vh,4em) 0}
.cy-cta-band__inner{display:flex;align-items:center;gap:2em;justify-content:space-between;flex-wrap:wrap}
.cy-cta-band h2{margin:0 0 .3em;max-width:30ch}
.cy-cta-band p{margin:0;color:var(--cy-text-soft);max-width:55ch}

/* Team */
.cy-team{display:grid;grid-template-columns:repeat(2,1fr);gap:1.6em}
@media (max-width:680px){.cy-team{grid-template-columns:1fr}}
.cy-team__card{background:var(--cy-surface);border:1px solid var(--cy-line);border-radius:var(--cy-radius-lg);padding:1.6em}
.cy-team__card h3{margin:0 0 .2em}

/* Insights grid */
.cy-insights-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.4em}
@media (max-width:980px){.cy-insights-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:640px){.cy-insights-grid{grid-template-columns:1fr}}
.cy-insight-card{background:var(--cy-surface);border:1px solid var(--cy-line);border-radius:var(--cy-radius-lg);padding:1.4em;display:flex;flex-direction:column;gap:.5em}
.cy-insight-card h2{font-size:1.15rem;margin:0}
.cy-insight-card a{color:var(--cy-text)}
.cy-insight-card a:hover{color:var(--cy-accent)}
.cy-insight-card .cy-link{margin-top:auto}

/* FAQ */
.cy-faq{display:grid;gap:.4em;margin:0 0 2em}
.cy-faq dt{font-weight:600;color:var(--cy-text);margin-top:1em}
.cy-faq dd{margin:0;color:var(--cy-text-soft);padding-bottom:.6em;border-bottom:1px solid var(--cy-line)}

/* Forms */
.cy-form{display:grid;gap:1em;background:var(--cy-surface);border:1px solid var(--cy-line);border-radius:var(--cy-radius-lg);padding:1.6em}
.cy-form label{display:grid;gap:.4em;font-weight:600;color:var(--cy-text);font-size:.92rem}
.cy-form input[type=text],.cy-form input[type=email],.cy-form input[type=tel],.cy-form input[type=url],.cy-form select,.cy-form textarea{
	background:var(--cy-bg);color:var(--cy-text);border:1px solid var(--cy-line-strong);
	border-radius:var(--cy-radius-sm);padding:.7em .9em;font:inherit;font-weight:400;
	transition:border-color .15s ease, box-shadow .15s ease;
}
.cy-form input:focus,.cy-form select:focus,.cy-form textarea:focus{
	outline:none;border-color:var(--cy-accent);box-shadow:0 0 0 3px rgba(91,227,200,.18)
}
.cy-form button[type=submit]{justify-self:start}
.cy-form__status{font-size:.92rem;color:var(--cy-text-soft);min-height:1.4em;margin:0}
.cy-form__status.is-error{color:var(--cy-danger)}
.cy-form__status.is-success{color:var(--cy-success)}
.cy-hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0;pointer-events:none}

/* Steps (quote form) */
.cy-form--quote{padding:1.6em}
.cy-steps{list-style:none;padding:0;margin:0;display:grid;gap:1em}
.cy-step{display:none}
.cy-step.is-active{display:grid;gap:.9em}
.cy-step h2{margin:0 0 .4em;font-size:1.2rem}
.cy-step__nav{display:flex;gap:.6em;margin-top:.6em;flex-wrap:wrap}
.cy-radio-stack{display:grid;gap:.5em}
.cy-radio-stack label{display:grid;grid-template-columns:auto 1fr;gap:.4em .8em;align-items:start;background:var(--cy-bg);border:1px solid var(--cy-line-strong);border-radius:var(--cy-radius-sm);padding:.8em 1em;cursor:pointer;font-weight:500}
.cy-radio-stack label:hover{border-color:var(--cy-accent)}
.cy-radio-stack input[type=radio]{margin-top:.3em}
.cy-radio-stack span{grid-column:2;color:var(--cy-text-muted);font-size:.88rem}

/* Contact list */
.cy-contact-list{list-style:none;padding:0;margin:0;display:grid;gap:1em}
.cy-contact-list li{background:var(--cy-surface);border:1px solid var(--cy-line);border-radius:var(--cy-radius-md);padding:1em 1.2em}
.cy-contact-list strong{color:var(--cy-text-muted);font-size:.78rem;letter-spacing:.12em;text-transform:uppercase;font-weight:600}

/* Footer */
.cy-footer{background:var(--cy-bg);border-top:1px solid var(--cy-line);margin-top:0}
.cy-footer__inner{max-width:var(--cy-grid-max);margin:0 auto;padding:3em var(--cy-gutter) 2em;display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:2em}
@media (max-width:780px){.cy-footer__inner{grid-template-columns:1fr 1fr}}
@media (max-width:480px){.cy-footer__inner{grid-template-columns:1fr}}
.cy-footer__brand{font-family:var(--cy-font-display);font-weight:700;font-size:1.2rem;color:var(--cy-text);display:inline-block;margin-bottom:.4em}
.cy-footer__col h4{font-size:.78rem;text-transform:uppercase;letter-spacing:.12em;color:var(--cy-text-muted);margin:0 0 .8em}
.cy-footer__col ul{list-style:none;padding:0;margin:0;display:grid;gap:.4em}
.cy-footer__col a{color:var(--cy-text-soft)}
.cy-footer__col a:hover{color:var(--cy-accent)}
.cy-footer__base{max-width:var(--cy-grid-max);margin:0 auto;padding:1.2em var(--cy-gutter);border-top:1px solid var(--cy-line);display:flex;justify-content:space-between;gap:1em;flex-wrap:wrap;color:var(--cy-text-muted);font-size:.88rem}