/* =========================================================
   Folded Logic Layout Architecture (Ma)
   An Origami-Inspired Layout Architecture
   Copyright © 2026 Peter Johnson
   Below the Fold Deferred CSS
   ========================================================= */


/* === 01. FOUNDATION ================== */

/* === 02. TYPOGRAPHY ================== */

/* === 03. MAIN ARCHITECTURE (KATA) === */




/********************* Case Results Kumi *********************/
#case-results {
	background:var(--color-panel-dark);
	--case-results-width-spine: 1240px;
	--color-text: #C8CDD5;
	--size-title: 48px;
	--color-title: #BB8E1B;
	--size-panel: 16px;
	--line-panel: 25px;
	--background-panel: #162A4E;
	--border-panel: #2E405F;
	--size-details-grid: 14px;
	--color-details-grid: #BB8E1B;
	--color-details-grid-hover: #FFC124;
	--letter-spacing-details-grid: .8px;
	--size-title-grid: 16px;
	--color-title-grid: #ffffff;
	--size-panel-grid: 14px;
	--line-panel-grid: 24px;
	--border-panel-grid: #8B6914;
	--border-panel-grid-hover: #C9981D;
}
#case-results .spine {max-width: var(--case-results-width-spine);}
.results-text {text-align:center;color:var(--color-text);}
.results-featured {text-align:center;}
.results-recent {padding:calc(var(--ken) * 3);margin-bottom:calc(var(--ken) * 4);border: var(--border-thin) solid var(--border-panel);position:relative;}
.result {padding:calc(var(--ken) * 4) var(--ken) calc(var(--ken) * 3) var(--ken);line-height:var(--line-panel);font-size: var(--size-panel);border: var(--border-thin) solid var(--border-panel);position:relative;}
.result-kasane {background: var(--background-panel);}
.result p {padding:0;}
.result p span.title {padding-bottom:calc(var(--ken) * 2);font-size: var(--size-title);font-weight:var(--weight-heavy);color:var(--color-title);display:inline-block;font-family: var(--font-display);}
.case-result-grid {}
.case-result-element {border-left: var(--border-strong) solid var(--border-panel-grid);transform: translateY(0);transition: transform .25s ease, border-color .25s ease;}
.case-result-element:hover {transform: translateY(calc(var(--ken) * -1));border-color: var(--border-panel-grid-hover);}
a.case-result {padding: 0 0 0 calc(var(--ken) * 3);line-height:var(--line-panel-grid);font-size: var(--size-panel-grid);font-weight:var(--weight-body);color:var(--color-text);display:block;}
a.case-result:hover {text-decoration:none;}
a.case-result span {display:block;}
a.case-result span.details {font-size: var(--size-details-grid);color:var(--color-details-grid);text-transform: uppercase;letter-spacing:var(--letter-spacing-details-grid);transition: color .25s ease;}
a.case-result:hover span.details {color:var(--color-details-grid-hover);}
a.case-result span.title {font-size: var(--size-title-grid);color:var(--color-title-grid);font-weight:var(--weight-medium);}

@media only screen and (min-width : 960px) and (max-width : 1279px) {
	#case-results {
		--size-title: 3.75vw;
		--size-panel: 1.25vw;
		--line-panel: 1.95vw;
		--size-details-grid: 1.09vw;
		--letter-spacing-details-grid: .0625vw;
		--size-title-grid: 1.25vw;
		--size-panel-grid: 1.09vw;
		--line-panel-grid: 1.87vw;
	}	
}

/********************* Attorney Kumi *********************/
#our-attorneys {
	--attorney-width-spine: 1240px;
	--color-text: #585756;
	--image-border: #E6E8EC;
	--image-border-hover: #8B6914;
	--size-subhead: 16px;
	--line-subhead: 20px;
	--color-subhead: #8B6914;
	--color-view-profile: #8B6914;
}
#our-attorneys .spine {max-width: var(--attorney-width-spine);}
.our-attorneys-text {text-align:center;color:var(--color-text);}
.attorneys-grid {margin-bottom:calc(var(--ken) * 2);}
.attorney {padding:0;position:relative;}
.attorney-grid-panel img {width:100%;outline: var(--border-strong) solid var(--image-border);transform: scale(1);transform-origin: center center;transition: transform .35s ease, outline-color .25s ease;}
.attorney-grid-panel:hover img {outline-color: var(--image-border-hover);transform: scale(1.02);}
.attorney-grid-panel p {padding: var(--ken) 0;font-weight:var(--weight-body);}
.attorney-grid-panel p.subhead {padding: 0;line-height:var(--line-subhead);font-size: var(--size-subhead);color:var(--color-subhead);font-weight:var(--weight-medium);}
.attorney-grid-panel span.view-profile {color:var(--color-view-profile);position:relative;}
.attorney-grid-panel span.view-profile span {display: inline-flex;align-items: center;gap: 10px;}
.attorney-grid-panel span.view-profile span::after {content: "→";color:var(--color-view-profile);line-height: 1;transform: translateX(-5px);transition: transform .25s ease;display: inline-block;}
.attorney-grid-panel:hover span.view-profile span::after {transform: translateX(0px);}

/********************* Testimonials Kumi *********************/
#client-testimonials {
	background: var(--color-page-soft);
	--testimonials-width-spine: 1280px;
	--size-panel: 16px;
	--line-panel: 27px;
	--color-panel: #0A0A0A;
	--color-stars: #8B6914;
	--size-stars: 18px;
	--background-panel: #ffffff;
	--border-panel: #8B6914;
	--border-author: #8B6914;
	--size-author: 18px;
	--line-author: 22px;
	--color-author: #0A1F44;
	--size-author-text: 13px;
	--color-author-text: #343434;
	--size-stat: 13px;
	--line-stat: 28px;
	--color-stat: #343434;
	--background-stat: #ffffff;
	--border-stat: #E6E8EC;
	--size-stat-amount: 36px;
	--color-stat-amount: #0A1F44;
}
#client-testimonials .spine {max-width: var(--testimonials-width-spine);}
.client-testimonials-text {}
.testimonials-grid {}
.testimonial-grid-panel {padding: calc(var(--ken) * 2) calc(var(--ken) * 3);background: var(--background-panel);border-left: var(--border-strong) solid var(--border-panel);line-height:var(--line-panel);font-size: var(--size-panel);color:var(--color-panel);}
.client-testimonials-stats {padding: calc(var(--ken) * 2);margin-bottom: calc(var(--ken) * 4);background: var(--background-stat);border: var(--border-thin) solid var(--border-stat);text-align:center;}
.testimonial-grid-panel p {}
.testimonial-grid-panel p.author {border-top: var(--border-thin) solid var(--color-line-soft);line-height:var(--line-author);font-size: var(--size-author-text);color:var(--color-author-text);}
.testimonial-grid-panel p.author strong {font-size: var(--size-author);font-family: var(--font-display);color:var(--color-author);}
.stars {color:var(--color-stars);font-size:var(--size-stars);}
.stars span {padding-right:calc(var(--ken) / 2);display:inline-block;}
.stat {padding: calc(var(--ken) / 2) calc(var(--ken) * 2) 0 calc(var(--ken) * 2);font-size: var(--size-stat);line-height:var(--line-stat);color:var(--color-stat);display:inline-block;border-right: var(--border-thin) solid var(--border-stat);}
.stat.last {border:none;}
.stat strong {font-size: var(--size-stat-amount);color:var(--color-stat-amount);font-family: var(--font-display);}

/********************* FAQ Kumi *********************/
#frequently-asked-questions {
	--faq-width-spine: 860px;
	--size-panel: 16px;
	--line-panel: 24px;
}
#frequently-asked-questions .spine {max-width: var(--faq-width-spine);}
#frequently-asked-questions .pocket {padding:calc(var(--ken) * 8) 0 0 0;}
.faq-text {}
.faq-qa {line-height:var(--line-panel);font-size: var(--size-panel);}

/********************* Blog Kumi *********************/
#blog-feed {
	background: var(--color-page-soft);
	--blog-feed-width-spine: 1260px;
	--size-panel: 16px;
	--line-panel: 24px;
}
#blog-feed .spine {max-width: var(--blog-feed-width-spine);}
.blog-text {padding-bottom:calc(var(--ken) * 4);}
.blog-item img {transform: scale(1);transform-origin: center center;transition: transform .35s ease, outline-color .25s ease;}
.blog-item:hover img {transform: scale(1.05);}
/********************* Contact Kumi *********************/
#contact {
	background: var(--color-panel-dark);
	--contact-width-spine: 1200px;
	--size-panel: 16px;
	--line-panel: 24px;
}
.ji.dark-kasane {background: var(--color-panel-dark);opacity:.9;}
#contact .spine {max-width: var(--contact-width-spine);}
.contact-form {padding: calc(var(--ken) * 3) calc(var(--ken) * 4);backdrop-filter: blur(5px);border: var(--border-thin) solid var(--color-line-soft);background:rgba(255,255,255,.1)}
.footer-form {padding-top: calc(var(--ken) * 2);}
.contact-text p.sm {line-height:var(--line-panel);font-size: var(--size-panel);}
.contact-text hr {margin: calc(var(--ken) * 2) auto calc(var(--ken) * 2) auto;}
.contact-text .button {margin: calc(var(--ken) * 2) 0 var(--ken) 0;}
.contact-form .button {display:block;width:100%;}


@media only screen and (min-width : 960px) and (max-width : 1239px) {

}

/********************* Footer Kumi *********************/
#footer {
	background:var(--color-panel-dark);
	--footer-width-spine: 1200px;
	--size-details: 14px;
	--line-details: 24px;
	--size-h2: 24px;
	--line-h2: 28px;
	--size-h3: 16px;
	--line-h3: 28px;
	--size-disclaimer: 12px;
	--line-disclaimer: 18px;
}
#footer .spine {max-width: var(--footer-width-spine);}
#footer .pocket {padding:calc(var(--ken) * 4) 0 calc(var(--ken) * 2) 0;}
.firm-details {padding-bottom:calc(var(--ken) * 2);line-height:var(--line-details);font-size: var(--size-details);}
.firm-details h2 {padding: 0 0 calc(var(--ken) * 2) 0;}
.firm-details h3 {padding: 0 0 calc(var(--ken) * 2) 0;}
img.office-pic {margin: var(--ken) auto 0 auto;}
.firm-details a {font-weight: var(--weight-medium);}
.firm-details ul {list-style:none;padding:0;}
.firm-details ul li {}
.social {padding:calc(var(--ken) * 2) 0; }
.social svg {width:26px; height: 26px;}
.social svg path {fill: #fff;}
a.social-profile {width:40px; height: 40px;background: #233557;color:#ffffff;}
a.social-profile:hover {background:#8B6914;}
.disclaimer {padding: 0;line-height:var(--line-disclaimer);font-size: var(--size-disclaimer);border-top: var(--border-thin) solid var(--color-line-soft);opacity:.7;}

/* === 04. LAYOUT ===================== */

/* === 05. MEDIA ====================== */

/* === 06. COMPONENTS ================= */
/****** Summary/Details ******/
summary {padding:calc(var(--ken) * 2) 0;font-size:var(--size-h2);line-height:var(--line-h2);color:var(--color-ink-strong);font-weight:var(--weight-strong);cursor:pointer;list-style:none;position:relative;}
summary::-webkit-details-marker {display:none;}
summary::marker {display:none;}
summary::after{content:"▸";position:absolute;right:0;top:50%;transform:translateY(-50%);transition:transform .25s ease;font-weight:var(--weight-heavy);}
details[open] summary::after{transform:translateY(-50%) rotate(90deg);}
.summary-content{overflow:hidden;height:0;}
details[open] .summary-content{height:auto;}

/****** Ougi (Slide Accordion) ******/
.ougi-fold {
	padding:calc(var(--ken) * 4) 0;
	--ougi-arrow-color: #8B6914;
	--ougi-hover-color: #FAF8F5;
}
.ougi{scroll-margin-top:var(--scroll-offset);margin-bottom: calc(var(--ken) * 2);border:var(--border-base) solid var(--color-line-faint);}
.ougi-header{padding:calc(var(--ken) * 2);font-size:var(--size-h6);line-height:var(--line-h6);color:var(--color-h6);width:100%;display:flex;justify-content:space-between;align-items:center;text-align:left;font-weight:var(--weight-strong);background:none;border:none;cursor:pointer;}
.ougi-header:focus-visible{outline:var(--focus-ring-width) solid var(--color-focus);outline-offset:var(--focus-ring-offset);}
.ougi-header:hover {background:var(--ougi-hover-color);}
.ougi-header[aria-expanded="true"] {background:var(--ougi-hover-color);}
.ougi-header[aria-expanded="true"] .ougi-arrow{transform:rotate(45deg);}
.ougi-arrow{transition:transform .35s cubic-bezier(.34,1.56,.64,1);color:var(--ougi-arrow-color);}
.ougi-panel{display:grid;grid-template-rows:0fr;transition:grid-template-rows .22s cubic-bezier(.4,0,.2,1);}
.ougi-panel.open{grid-template-rows:1fr;}
.ougi-inner{overflow:hidden;padding: var(--ken) calc(var(--ken) * 2) var(--ken) calc(var(--ken) * 2);border-top:var(--border-thin) solid var(--color-line-faint);opacity:0;transform:translateY(-8px);transition:opacity .18s ease .08s,transform .18s ease .08s;}
.ougi-panel.open .ougi-inner{opacity:1;transform:translateY(0);}


/* === 07. FORMS ====================== */

/* === 08. UTILITIES ================== */

/* === 09. THEME/VARIANTS ============= */


/* ==================================================================================================================
   RESPONSIVE (Tablet and Mobile)
   ================================================================================================================== */
@media only screen and (max-width : 959px) {

	/*** Case Results Kumi ***/
	#case-results {
		--size-title: 3.75vw;
		--size-panel: 12px;
		--line-panel: 18px;
		--size-details-grid: 12px;
		--letter-spacing-details-grid: .59px;
		--size-title-grid: 14px;
		--size-panel-grid: 12px;
		--line-panel-grid: 17px;
	}

	/*** Testimonials Kumi ***/
	#client-testimonials {
		--size-panel: 14px;
		--line-panel: 20px;
		--size-stars: 16px;
		--size-author: 16px;
		--line-author: 20px;
		--line-stat: 26px;
		--size-stat-amount: 24px;
	}

	/********************* FAQ Kumi *********************/
	#frequently-asked-questions {
		--size-panel: 14px;
		--line-panel: 20px;
	}

	/********************* Footer Kumi *********************/
	#footer {
		--line-details: 20px;
		--size-h2: 20px;
		--line-disclaimer: 16px;
	}	
	
}

/* ==================================================================================================================
   RESPONSIVE (Mobile)
   ================================================================================================================== */
@media only screen and (max-width : 639px) {
	
	/*** Case Results Kumi ***/
	#case-results {
		--size-title: 24px;
	}

	/*** Attorneys Kumi ***/
	.attorneys-grid {max-width:400px;margin-left: auto;margin-right: auto;}

	/*** blog Kumi ***/
	.blogs {max-width:300px;margin: 0 auto;}
	.blog-item {margin-bottom:calc(var(--ken) * 4);}
	.blog-item.last {margin-bottom:0;}
	/*** Contact Kumi ***/
	.contact-text {padding-bottom:calc(var(--ken) * 4);}

	/*** Footer Kumi ***/
	.firm-details {text-align:center;}
	.social {justify-content: center;padding-top:calc(var(--ken) * 4);}
	.foot-ord-1 {order: 1;padding-bottom:calc(var(--ken) * 4);}
	.foot-ord-2 {order: 3;}
	.foot-ord-3 {order: 4;}
	.foot-ord-4 {order: 2;padding-bottom:calc(var(--ken) * 4);}
	.foot-ord-5 {order: 5;}


	
}