/* ==========================================================================
   Proprietorship Firm Registration — page-scoped premium enhancements
   Presentation-only additions; reuses the theme's fonts, accent color and
   button classes. Same visual system as trademark-page.css, scoped under
   .pf-page so it never leaks into other pages.
   ========================================================================== */

.pf-page{
	--pf-accent: #00bffe;
	--pf-accent-dark: #009fd6;
	--pf-heading: #222222;
	--pf-text: #6f7377;
	--pf-radius: 12px;
	--pf-shadow: 0 10px 30px rgba(15, 23, 42, 0.07);
	--pf-shadow-hover: 0 20px 40px rgba(15, 23, 42, 0.14);
	--pf-border: #eef1f4;
}

/* ---- Page-title banner ----
   Real photo goes in as a CSS background (via inline style="background-image:
   url(...)" on the section) rather than baked into the graphic. The gradient
   below is just the fallback shown until that file exists. Sized to the same
   2002:786 aspect ratio as page-title-bg-trademark.jpg so the banner takes up
   the same amount of vertical space as the trademark page's hero at any
   viewport width. No overlay, so the photo shows at full, undimmed color. */
.pf-hero-title{
	position: relative;
	padding: 0;
	aspect-ratio: 2002 / 786;
	background-color: #0d1b2a;
	background-image: linear-gradient(135deg, #0d1b2a, #123452 55%, #00bffe);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	overflow: hidden;
}
/* Theme's default .page-title:before (style.css) adds a 50% black overlay
   on every page-title banner; disabled here so the photo shows undimmed. */
.pf-hero-title:before{
	display: none;
}
.pf-hero-inner{
	position: relative;
	z-index: 1;
	padding: 0 20px;
}
.pf-hero-inner h1{
	margin: 0 0 12px;
	color: #ffffff;
	font-family: 'Poppins', sans-serif;
	font-weight: 700;
	font-size: 40px;
}
.pf-hero-inner p{
	margin: 0;
	color: rgba(255, 255, 255, .85);
	font-family: 'Lato', sans-serif;
	font-size: 16px;
}
@media (max-width: 767px){
	.pf-hero-inner h1{
		font-size: 28px;
	}
}

/* ---- Image placeholders ----
   Used wherever a real photo/graphic isn't available yet. Dashed border +
   icon signal "placeholder" rather than reading as a broken image. Sized to
   the same aspect ratio as the real photo it stands in for on the
   trademark page, so both pages occupy identical image space. Swap the
   containing element's markup for a real <img> once assets exist. */
.pf-img-placeholder{
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 10px;
	width: 100%;
	/* matches images/bds/services/trademark-renewal-cta.jpg (2007x783) */
	aspect-ratio: 2007 / 783;
	background: linear-gradient(135deg, rgba(0, 191, 254, .08), rgba(0, 191, 254, .02));
	border: 2px dashed rgba(0, 191, 254, .35);
	border-radius: var(--pf-radius);
	color: var(--pf-accent-dark);
	font-family: 'Poppins', sans-serif;
	font-weight: 600;
	font-size: 14px;
	text-align: center;
}
.pf-img-placeholder i{
	font-size: 36px;
}

/* ---- Hero image box ---- */
.pf-page .services-left > .image-box{
	position: relative;
	border-radius: var(--pf-radius);
	overflow: hidden;
	box-shadow: var(--pf-shadow);
}
.pf-page .services-left > .image-box figure{
	margin: 0;
}
.pf-page .services-left > .image-box img{
	display: block;
	width: 100%;
	height: auto;
	transition: transform .6s ease;
}
.pf-page .services-left > .image-box:hover img{
	transform: scale(1.03);
}

/* ---- Quick-facts strip ---- */
.pf-quickfacts{
	display: flex;
	flex-wrap: wrap;
	gap: 18px;
	margin: 32px 0 4px;
	padding: 0;
	list-style: none;
}
.pf-quickfacts li{
	flex: 1 1 200px;
	display: flex;
	align-items: center;
	gap: 16px;
	background: #ffffff;
	border: 1px solid var(--pf-border);
	border-radius: var(--pf-radius);
	padding: 20px 22px;
	box-shadow: var(--pf-shadow);
	transition: transform .35s ease, box-shadow .35s ease, border-color .35s ease;
}
.pf-quickfacts li:hover{
	transform: translateY(-6px);
	box-shadow: var(--pf-shadow-hover);
	border-color: rgba(0, 191, 254, .35);
}
.pf-quickfacts .pf-fact-icon{
	flex: 0 0 50px;
	width: 50px;
	height: 50px;
	border-radius: 50%;
	background: rgba(0, 191, 254, .1);
	color: var(--pf-accent);
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 20px;
}
.pf-quickfacts h6{
	margin: 0 0 2px;
	font-size: 15px;
	font-weight: 700;
	color: var(--pf-heading);
	font-family: 'Poppins', sans-serif;
}
.pf-quickfacts span{
	font-size: 13px;
	color: var(--pf-text);
	font-family: 'Lato', sans-serif;
}

/* ---- Content cards ---- */
.pf-content-card{
	background: #ffffff;
	border: 1px solid var(--pf-border);
	border-radius: var(--pf-radius);
	box-shadow: var(--pf-shadow);
	padding: 44px 42px;
	margin-top: 36px;
}
.pf-section-icon{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 56px;
	height: 56px;
	border-radius: 14px;
	background: linear-gradient(135deg, var(--pf-accent), #4bd2fe);
	color: #ffffff;
	font-size: 24px;
	margin-bottom: 20px;
	box-shadow: 0 10px 22px rgba(0, 191, 254, .32);
}
.pf-page .image-content .sec-title-three{
	padding-top: 0;
}
.pf-page .image-content p{
	font-size: 16.5px;
	text-align: justify;
}
.pf-key-aspects-label{
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: var(--pf-accent-dark);
	margin: 22px 0 20px;
}
.pf-key-aspects-label:before{
	content: '';
	width: 24px;
	height: 2px;
	background: var(--pf-accent);
	display: inline-block;
}

/* ---- Feature grid ---- */
.pf-feature-grid{
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 18px;
	margin: 0;
	padding: 0;
	list-style: none;
}
.pf-feature-card{
	display: block;
	height: 100%;
	background: #f8fafc;
	border: 1px solid var(--pf-border);
	border-radius: var(--pf-radius);
	padding: 22px 24px;
	transition: transform .3s ease, box-shadow .3s ease, background-color .3s ease, border-color .3s ease;
}
.pf-feature-card:hover{
	transform: translateY(-5px);
	box-shadow: var(--pf-shadow-hover);
	background: #ffffff;
	border-color: rgba(0, 191, 254, .4);
}
.pf-feature-check{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 30px;
	height: 30px;
	border-radius: 50%;
	background: rgba(0, 191, 254, .12);
	color: var(--pf-accent-dark);
	margin-bottom: 12px;
	font-size: 13px;
}
.pf-feature-card strong{
	display: block;
	font-family: 'Poppins', sans-serif;
	font-size: 16px;
	font-weight: 600;
	color: var(--pf-heading);
	margin-bottom: 8px;
	line-height: 24px;
}
.pf-feature-desc{
	display: block;
	font-family: 'Lato', sans-serif;
	font-size: 14.5px;
	line-height: 24px;
	color: var(--pf-text);
	text-align: justify;
}

/* Last item in an odd-count grid spans full width instead of leaving an empty cell */
.pf-feature-grid li:last-child:nth-child(odd){
	grid-column: 1 / -1;
}

/* ---- Sidebar ---- */
.pf-page .any-questions{
	border-radius: var(--pf-radius);
	box-shadow: var(--pf-shadow);
	transition: transform .35s ease, box-shadow .35s ease;
}
.pf-page .any-questions:hover{
	transform: translateY(-4px);
	box-shadow: var(--pf-shadow-hover);
}

/* ---- CTA / quote panel ---- */
#quote-form.row{
	display: flex;
	flex-wrap: wrap;
	align-items: stretch;
}
.pf-cta-panel{
	background: #ffffff;
	border: 1px solid var(--pf-border);
	border-radius: 18px;
	box-shadow: var(--pf-shadow-hover);
	padding: 50px;
	position: relative;
	overflow: hidden;
	width: 100%;
}
.pf-cta-panel:before{
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 5px;
	background: linear-gradient(90deg, var(--pf-accent), #4bd2fe, var(--pf-accent));
}
.pf-cta-panel .shoos-us-content h5{
	font-family: 'Poppins', sans-serif;
	font-weight: 600;
	color: var(--pf-heading);
}
.pf-cta-panel .contact-form-one .form-group{
	margin-bottom: 22px;
}
.pf-cta-panel .contact-form-one .form-group input,
.pf-cta-panel .contact-form-one .form-group select{
	color: var(--pf-heading);
	background: #f8fafc;
	border: 1px solid var(--pf-border);
	border-radius: 8px;
	height: 48px;
	padding: 0 16px;
	line-height: 46px;
	transition: border-color .3s ease, box-shadow .3s ease, background .3s ease;
}
.pf-cta-panel .contact-form-one .form-group input:focus,
.pf-cta-panel .contact-form-one .form-group select:focus{
	background: #ffffff;
	border-color: var(--pf-accent);
	box-shadow: 0 0 0 3px rgba(0, 191, 254, .15);
	outline: none;
}
.pf-cta-panel .contact-form-one .form-group input::placeholder{
	color: #9aa0a6;
}
.pf-cta-btn{
	border-radius: 8px;
	transition: transform .3s ease, box-shadow .3s ease, background .3s ease;
}
.pf-cta-btn:hover{
	transform: translateY(-3px);
	box-shadow: 0 14px 26px rgba(0, 191, 254, .35);
}

/* Placeholder graphic column stretches to match the quote-form's height
   (row has align-items:stretch) and centers the placeholder card within it. */
.pf-call-col{
	display: flex;
	align-items: center;
}
.pf-call-card{
	width: 100%;
	border-radius: var(--pf-radius);
	overflow: hidden;
	box-shadow: var(--pf-shadow-hover);
	background: #ffffff;
	border: 1px solid var(--pf-border);
}
.pf-img-placeholder-call{
	/* matches images/bds/services/trademark-certify-renew-protect.jpg (1286x1223) */
	aspect-ratio: 1286 / 1223;
	border-radius: var(--pf-radius) var(--pf-radius) 0 0;
	border-width: 2px 2px 0 2px;
}
.pf-call-img{
	margin: 0;
	/* matches images/bds/services/trademark-certify-renew-protect.jpg (1286x1223) */
	aspect-ratio: 1286 / 1223;
	overflow: hidden;
}
.pf-call-img img{
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform .6s ease;
}
.pf-call-card:hover .pf-call-img img{
	transform: scale(1.03);
}
.pf-call-card .title-box{
	padding: 18px 22px;
	text-align: center;
}
.pf-call-card .title-box h6{
	margin: 0;
	font-family: 'Poppins', sans-serif;
	font-weight: 600;
	color: var(--pf-heading);
}

/* ---- Registration plans (Basic / Advanced) ---- */
.pf-plans-grid{
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 24px;
	margin: 0;
}
.pf-plan-card{
	background: #f8fafc;
	border: 1px solid var(--pf-border);
	border-radius: var(--pf-radius);
	padding: 28px 26px;
	transition: transform .3s ease, box-shadow .3s ease, border-color .3s ease;
}
.pf-plan-card:hover{
	transform: translateY(-5px);
	box-shadow: var(--pf-shadow-hover);
	border-color: rgba(0, 191, 254, .4);
}
@media (hover: hover) and (pointer: fine){
	.pf-plan-card:hover{
		transform: translateY(-5px) scale(1.04);
		box-shadow: 0 25px 50px rgba(15, 23, 42, .16), var(--pf-shadow-hover);
		z-index: 2;
	}
}
.pf-plan-card.pf-plan-advanced{
	background: #0d1b2a;
	border-color: #0d1b2a;
}
.pf-plan-card h4{
	margin: 0 0 18px;
	font-family: 'Poppins', sans-serif;
	font-weight: 600;
	font-size: 19px;
	color: var(--pf-heading);
}
.pf-plan-card.pf-plan-advanced h4{
	color: #ffffff;
}
.pf-plan-list{
	margin: 0;
	padding: 0;
	list-style: none;
}
.pf-plan-list li{
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 9px 0;
	font-family: 'Lato', sans-serif;
	font-size: 14.5px;
	color: var(--pf-text);
	border-bottom: 1px solid var(--pf-border);
}
.pf-plan-list li:last-child{
	border-bottom: none;
}
.pf-plan-list li i{
	color: var(--pf-accent);
	font-size: 13px;
	flex-shrink: 0;
}
.pf-plan-card.pf-plan-advanced .pf-plan-list li{
	color: rgba(255, 255, 255, .82);
	border-bottom-color: rgba(255, 255, 255, .1);
}
.pf-plan-card.pf-plan-advanced .pf-plan-list li i{
	color: #4bd2fe;
}
@media (max-width: 767px){
	.pf-plans-grid{
		grid-template-columns: 1fr;
	}
}

/* ---- FAQ accordion ----
   Built with native <details>/<summary> — no JS dependency, works
   everywhere, keyboard and screen-reader accessible out of the box. */
.pf-faq-accordion{
	margin: 0;
}
.pf-faq-item{
	border: 1px solid var(--pf-border);
	border-radius: var(--pf-radius);
	background: #f8fafc;
	margin-bottom: 14px;
	overflow: hidden;
	transition: border-color .3s ease, background-color .3s ease;
}
.pf-faq-item[open]{
	background: #ffffff;
	border-color: rgba(0, 191, 254, .4);
}
.pf-faq-item summary.pf-faq-question{
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 18px;
	list-style: none;
	cursor: pointer;
	padding: 20px 24px;
	font-family: 'Poppins', sans-serif;
	font-weight: 600;
	font-size: 15.5px;
	color: var(--pf-heading);
	line-height: 24px;
}
.pf-faq-item summary.pf-faq-question::-webkit-details-marker{
	display: none;
}
.pf-faq-item summary.pf-faq-question::marker{
	content: '';
}
.pf-faq-icon{
	flex-shrink: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 30px;
	height: 30px;
	border-radius: 50%;
	background: rgba(0, 191, 254, .12);
	color: var(--pf-accent-dark);
	font-size: 13px;
	transition: transform .3s ease, background-color .3s ease, color .3s ease;
}
.pf-faq-item[open] .pf-faq-icon{
	background: var(--pf-accent);
	color: #ffffff;
	transform: rotate(135deg);
}
.pf-faq-answer{
	padding: 0 24px 22px 24px;
}
.pf-faq-answer p{
	margin: 0;
	font-family: 'Lato', sans-serif;
	font-size: 14.5px;
	line-height: 25px;
	color: var(--pf-text);
}
@media (max-width: 480px){
	.pf-faq-item summary.pf-faq-question{
		padding: 16px 18px;
		font-size: 14.5px;
	}
	.pf-faq-answer{
		padding: 0 18px 18px 18px;
	}
}

/* ---- Responsive ---- */
@media (max-width: 991px){
	.pf-content-card{
		padding: 34px 26px;
	}
	.pf-cta-panel{
		padding: 34px 24px;
	}
}
@media (max-width: 767px){
	.pf-feature-grid{
		grid-template-columns: 1fr;
	}
	.pf-quickfacts li{
		flex: 1 1 100%;
	}
	.pf-content-card{
		padding: 28px 20px;
		margin-top: 26px;
	}
}
