/*
=============================================================
TRILOGIX INSTITUTE WEBSITE
File: contact.css
Purpose: Contact page styling.
Maintenance note: Related rules and logic are grouped and documented by feature.
=============================================================
*/

/*
STYLE ORGANIZATION
- Base/component rules define the default desktop presentation.
- State classes such as .active, .show, and :hover control interactions.
- Media queries near the relevant rules adapt the layout for tablet and mobile screens.
*/

/* Contact page — exact approved shared theme integration */
.contact-hero .about-hero-content{
  z-index:4;
}
.contact-hero .hero-v2-layout{
  max-width:850px;
}
.campus-section{
  padding:clamp(4.5rem,7vw,7rem) 0;
  background:#fff;
}
.campus-section .row{align-items:stretch}
.campus-section [class*="col-"]{display:flex}
.campus-card{
  width:100%;
  height:100%;
  overflow:hidden;
  border:1px solid var(--border,#e2e8f0);
  border-radius:24px;
  background:#fff;
  box-shadow:0 18px 48px rgba(15,23,42,.08);
  transition:transform .3s ease,box-shadow .3s ease,border-color .3s ease;
}
.campus-card:hover{
  transform:translateY(-6px);
  border-color:rgba(23,70,200,.25);
  box-shadow:0 28px 64px rgba(15,23,42,.13);
}
.map-wrap{
  position:relative;
  aspect-ratio:16/9;
  min-height:260px;
  overflow:hidden;
  background:#edf2f7;
}
.map-wrap iframe{
  width:100%;
  height:100%;
  border:0;
}
.map-link{
  position:absolute;
  top:1rem;
  right:1rem;
  padding:.62rem .88rem;
  border-radius:999px;
  background:rgba(255,255,255,.95);
  color:var(--primary,#1746c8);
  text-decoration:none;
  font-size:.72rem;
  font-weight:800;
  box-shadow:0 12px 28px rgba(15,23,42,.15);
  backdrop-filter:blur(10px);
}
.campus-body{
  min-height:410px;
  display:flex;
  flex-direction:column;
  padding:clamp(1.5rem,3vw,2.1rem);
}
.campus-label,.section-label{
  font-size:.7rem;
  font-weight:800;
  letter-spacing:.2em;
  text-transform:uppercase;
  color:var(--primary,#1746c8);
}
.campus-body h3{
  margin:.5rem 0 0;
  font-family:"Plus Jakarta Sans",sans-serif;
  font-size:clamp(1.25rem,2vw,1.55rem);
  line-height:1.3;
  font-weight:800;
  letter-spacing:-.025em;
}
.contact-list{
  list-style:none;
  padding:0;
  margin:1.5rem 0 0;
}
.contact-list li{
  display:flex;
  align-items:flex-start;
  gap:.8rem;
  margin:.9rem 0;
  color:#475467;
  font-size:.89rem;
  line-height:1.62;
}
.contact-list i{
  width:34px;
  height:34px;
  flex:0 0 34px;
  display:grid;
  place-items:center;
  margin-top:-.15rem;
  border-radius:10px;
  background:#edf3ff;
  color:var(--primary,#1746c8);
}
.contact-list a{
  color:inherit;
  text-decoration:none;
}
.contact-list a:hover{
  color:var(--primary,#1746c8);
}
.campus-actions{
  display:flex;
  flex-wrap:wrap;
  gap:.65rem;
  margin-top:auto;
  padding-top:1.45rem;
}
.campus-actions a{
  min-height:42px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.45rem;
  padding:.66rem .95rem;
  border-radius:10px;
  text-decoration:none;
  font-size:.76rem;
  font-weight:700;
  transition:transform .2s ease,box-shadow .2s ease;
}
.campus-actions a:hover{
  transform:translateY(-2px);
}
.action-primary{
  color:#fff;
  background:linear-gradient(135deg,#1746c8,#2d63e5);
  box-shadow:0 11px 24px rgba(23,70,200,.22);
}
.action-outline{
  color:#101828;
  background:#fff;
  border:1px solid #e4e9f2;
}
.inquiry-section{
  position:relative;
  overflow:hidden;
  padding:clamp(4.5rem,7vw,7rem) 0;
  border-top:1px solid #e4e9f2;
  background:
  radial-gradient(circle at 90% 12%,rgba(23,70,200,.08),transparent 25%),
  #f6f8fc;
}
.inquiry-copy{
  position:sticky;
  top:112px;
}
.inquiry-copy h2{
  max-width:500px;
  margin:.7rem 0 0;
  font-family:"Plus Jakarta Sans",sans-serif;
  font-size:clamp(2.15rem,4.3vw,3.4rem);
  line-height:1.06;
  font-weight:800;
  letter-spacing:-.045em;
}
.inquiry-copy p{
  max-width:500px;
  margin:1.2rem 0 0;
  color:#667085;
  font-size:.95rem;
  line-height:1.8;
}
.benefits{
  list-style:none;
  display:grid;
  gap:.9rem;
  padding:0;
  margin:1.7rem 0 0;
}
.benefits li{
  display:flex;
  align-items:center;
  gap:.75rem;
  color:#344054;
  font-size:.9rem;
}
.benefits i{
  width:35px;
  height:35px;
  flex:0 0 35px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:#eaf0ff;
  color:var(--primary,#1746c8);
}
.inquiry-form{
  display:grid;
  gap:1rem;
  padding:clamp(1.4rem,3vw,2.3rem);
  border:1px solid #e4e9f2;
  border-radius:24px;
  background:#fff;
  box-shadow:0 18px 48px rgba(15,23,42,.08);
}
.form-group{
  display:grid;
  gap:.5rem;
}
.form-group label{
  font-size:.71rem;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:#475467;
}
.form-control,.form-select{
  min-height:50px;
  border:1px solid #e4e9f2;
  border-radius:10px;
  background:#fff;
  color:#101828;
  font-size:.9rem;
}
.form-control:focus,.form-select:focus{
  border-color:var(--primary,#1746c8);
  box-shadow:0 0 0 .22rem rgba(23,70,200,.10);
}
textarea.form-control{
  min-height:145px;
  resize:vertical;
}
.send-btn{
  width:100%;
  min-height:50px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.55rem;
  border:0;
  border-radius:10px;
  padding:.8rem 1.4rem;
  color:#fff;
  background:linear-gradient(135deg,#1746c8,#2d63e5);
  box-shadow:0 12px 28px rgba(23,70,200,.23);
  font-weight:700;
}

/* Responsive breakpoint: adjusts the related component for this viewport range. */
@media(min-width:768px){
  .inquiry-form{grid-template-columns:repeat(2,minmax(0,1fr))}
  .span-2{grid-column:span 2}
}

/* Responsive breakpoint: adjusts the related component for this viewport range. */
@media(max-width:991.98px){
  .inquiry-copy{position:static}
}

/* Responsive breakpoint: adjusts the related component for this viewport range. */
@media(max-width:767.98px){
  .campus-section,.inquiry-section{padding:3.75rem 0}
  .map-wrap{min-height:235px}
  .campus-body{min-height:auto}
  .campus-actions{
    display:grid;
    grid-template-columns:1fr 1fr;
  }
.campus-actions .action-primary{grid-column:1/-1}
}

/* Responsive breakpoint: adjusts the related component for this viewport range. */
@media(max-width:479.98px){
  .campus-card,.inquiry-form{border-radius:19px}
  .map-wrap{aspect-ratio:4/3;min-height:215px}
  .campus-body{padding:1.3rem}
  .contact-list li{font-size:.84rem}
  .campus-actions{grid-template-columns:1fr}
  .campus-actions .action-primary{grid-column:auto}
}
/* V6 — minor refinements */
/* Tighter campus details and actions */
.contact-list{
  margin-top:1.15rem;
}
.contact-list li{
  margin:.52rem 0;
  gap:.7rem;
  line-height:1.48;
}
.contact-list i{
  width:31px;
  height:31px;
  flex-basis:31px;
  border-radius:9px;
}
.campus-actions{
  gap:.5rem;
  padding-top:1rem;
}
.campus-actions a{
  min-height:39px;
  padding:.58rem .82rem;
}
/* Uniform inquiry heading typography */
.inquiry-copy .section-title{
  max-width:500px;
  margin:.7rem 0 0;
  font-family:"Plus Jakarta Sans",sans-serif;
  font-size:clamp(2.15rem,4.3vw,3.45rem);
  line-height:1.06;
  font-weight:800;
  letter-spacing:-.045em;
}
/* Clear select/dropdown indicator */
.inquiry-form .form-select{
  cursor:pointer;
  appearance:none;
  -webkit-appearance:none;
  padding-right:3rem;
  background-color:#fff;
  background-image:
  linear-gradient(45deg,transparent 50%,#667085 50%),
  linear-gradient(135deg,#667085 50%,transparent 50%);
  background-position:
  calc(100% - 19px) 50%,
  calc(100% - 14px) 50%;
  background-size:5px 5px,5px 5px;
  background-repeat:no-repeat;
}
.inquiry-form .form-select:hover{
  border-color:#c9d3e3;
}
.form-helper{
  display:block;
  margin-top:.1rem;
  color:#98a2b3;
  font-size:.72rem;
  line-height:1.5;
}
.message-helper{
  margin-top:.15rem;
}
/* Exact FAQ presentation used on the Home/Index page */
.contact-faq-section{
  border-top:1px solid #e4e9f2;
}
.contact-faq-section .faq-wrap{
  max-width:900px;
  margin-inline:auto;
}
.contact-faq-section .accordion-item{
  border:1px solid var(--border,#e4e9f2)!important;
  border-radius:12px!important;
  overflow:hidden;
  margin-bottom:.75rem;
  background:#fff;
}
.contact-faq-section .accordion-button{
  min-height:auto;
  padding:1.15rem 1.25rem;
  background:#fff;
  color:#101828;
  font-family:"Inter",sans-serif;
  font-size:.95rem;
  font-weight:700;
  line-height:1.5;
  box-shadow:none;
}
.contact-faq-section .accordion-button:not(.collapsed){
  color:var(--primary,#1746c8);
  background:#f4f7ff;
  box-shadow:none;
}
.contact-faq-section .accordion-button:focus{
  box-shadow:0 0 0 .2rem rgba(0,87,184,.12);
}
.contact-faq-section .accordion-body{
  padding:1rem 1.25rem 1.25rem;
  color:var(--muted,#667085);
  font-size:.9rem;
  line-height:1.75;
}

/* Responsive breakpoint: adjusts the related component for this viewport range. */
@media(max-width:575.98px){
  .contact-list li{
    margin:.45rem 0;
  }
.campus-actions{
  padding-top:.85rem;
}
.contact-faq-section .accordion-button{
  padding:1rem;
  font-size:.87rem;
}
.contact-faq-section .accordion-body{
  padding:.85rem 1rem 1rem;
  font-size:.85rem;
}
}
/* V7 — final spacing and layout polish */
/* Campus card: bring actions closer to details */
.campus-body{
  min-height:auto;
}
.contact-list{
  margin:1rem 0 0;
}
.contact-list li{
  margin:.42rem 0;
  gap:.65rem;
  line-height:1.42;
}
.campus-actions{
  margin-top:.75rem;
  padding-top:0;
  gap:.5rem;
}
.campus-actions a{
  min-height:38px;
  padding:.56rem .8rem;
}
/* Inquiry benefits: compact and cohesive */
.benefits{
  gap:.55rem;
  margin:1.2rem 0 0;
}
.benefits li{
  gap:.65rem;
  font-size:.88rem;
  line-height:1.45;
}
.benefits i{
  width:30px;
  height:30px;
  flex:0 0 30px;
}
/* FAQ: left copy, right accordion, same current card styling */
.contact-faq-section{
  padding:clamp(4.5rem,7vw,7rem) 0;
}
.contact-faq-section .contact-faq-layout{
  max-width:none;
  display:grid;
  grid-template-columns:minmax(0,.8fr) minmax(520px,1.2fr);
  gap:clamp(2.5rem,6vw,5.5rem);
  align-items:start;
}
.contact-faq-copy{
  position:sticky;
  top:112px;
  text-align:left;
}
.contact-faq-copy .section-label{
  text-align:left;
}
.contact-faq-copy .section-title{
  max-width:520px;
  margin:.65rem 0 0;
  text-align:left;
}
.contact-faq-copy .section-subtitle{
  max-width:500px;
  margin:1rem 0 0;
  text-align:left;
}
.contact-faq-accordion{
  margin-top:0!important;
}
.contact-final-cta{
  padding-top:0;
}

/* Responsive breakpoint: adjusts the related component for this viewport range. */
@media(max-width:991.98px){
  .contact-faq-section .contact-faq-layout{
    grid-template-columns:1fr;
    gap:2rem;
  }
.contact-faq-copy{
  position:static;
}
}

/* Responsive breakpoint: adjusts the related component for this viewport range. */
@media(max-width:767.98px){
  .contact-list{
    margin-top:.9rem;
  }
.campus-actions{
  margin-top:.65rem;
}
.benefits{
  gap:.5rem;
  margin-top:1rem;
}
}
/* V9 — corrected interpretation */
/* Match "Send us a message" to the smaller FAQ heading size */
.inquiry-copy .inquiry-heading-small{
  max-width:520px;
  margin:.65rem 0 0;
  font-family:"Plus Jakarta Sans",sans-serif;
  font-size:clamp(1.8rem,3vw,2.45rem)!important;
  line-height:1.12!important;
  font-weight:800!important;
  letter-spacing:-.035em!important;
}
/* Preserve the previous CTA styling and layout from V7 */
.contact-final-cta{
  padding-top:0;
}

/* Responsive breakpoint: adjusts the related component for this viewport range. */
@media(max-width:575.98px){
  .inquiry-copy .inquiry-heading-small{
    font-size:clamp(1.65rem,7vw,2.15rem)!important;
  }
}
